/*
 * X-Telecom shared UI overrides.
 * This file is loaded last and keeps user-facing pages on one visual system.
 * Admin pages do not include this asset.
 */
:root {
    --xtel-control-height: 40px;
    --xtel-control-radius: 7px;
    --xtel-filter-date-width: 188px;
    --xtel-filter-time-width: 104px;
    --xtel-filter-field-width: 304px;
    --xtel-filter-gap-x: 36px;
    --xtel-filter-gap-y: 18px;
    --xtel-filter-button-width: 128px;
    --xtel-filter-primary-button-width: 150px;
    --xtel-page-bg: #000000;
    --xtel-surface: #11141a;
    --xtel-surface-soft: #1e2127;
    --xtel-border: #2b3038;
    --xtel-text: #f8fafc;
    --xtel-muted: #cbd5e1;
}

/* Calls filter reference layout v4. Must remain last. */
[data-xtel-page] .page-calls .xtel-filter-card {
    --xtel-ref-date-width: 214px !important;
    --xtel-ref-time-width: 132px !important;
    --xtel-ref-field-width: 360px !important;
    --xtel-ref-status-width: 360px !important;
    --xtel-ref-gap-x: 46px !important;
    --xtel-ref-gap-y: 18px !important;
    --xtel-ref-control-height: 44px !important;
    --xtel-ref-button-width: 140px !important;
    --xtel-ref-action-width: 144px !important;
}

[data-xtel-page] .page-calls .xtel-filter-card > .px-4.py-5,
[data-xtel-page] .page-calls .xtel-filter-card > .px-4,
[data-xtel-page] .page-calls .xtel-filter-card > .md\:px-6 {
    padding: 34px 46px 30px !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-reference {
    display: grid !important;
    grid-template-columns:
        calc(var(--xtel-ref-date-width) + var(--xtel-ref-time-width) + 16px)
        var(--xtel-ref-field-width)
        var(--xtel-ref-field-width)
        var(--xtel-ref-status-width) !important;
    column-gap: var(--xtel-ref-gap-x) !important;
    row-gap: var(--xtel-ref-gap-y) !important;
    align-items: start !important;
    width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-stack {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: var(--xtel-ref-gap-y) !important;
    width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-field,
[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-field-select,
[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-field-text {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: none !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-date-pair {
    display: grid !important;
    grid-template-columns: var(--xtel-ref-date-width) var(--xtel-ref-time-width) !important;
    gap: 16px !important;
    width: 100% !important;
    max-width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-filter-card label {
    margin-bottom: 8px !important;
    color: var(--xtel-clean-label) !important;
    font-size: 20px !important;
    font-weight: 600 !important;
    line-height: 1.15 !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-control,
[data-xtel-page] .page-calls .xtel-filter-card input.xtel-filter-control,
[data-xtel-page] .page-calls .xtel-filter-card select.xtel-filter-control,
[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-date-pair input {
    box-sizing: border-box !important;
    width: 100% !important;
    height: var(--xtel-ref-control-height) !important;
    min-height: var(--xtel-ref-control-height) !important;
    max-height: var(--xtel-ref-control-height) !important;
    padding: 0 14px !important;
    border-radius: 0 !important;
    border: 1px solid var(--xtel-clean-border) !important;
    background: var(--xtel-clean-control) !important;
    color: var(--xtel-clean-text) !important;
    font-size: 18px !important;
    line-height: var(--xtel-ref-control-height) !important;
    box-shadow: none !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-control::placeholder {
    color: var(--xtel-clean-subtle) !important;
    opacity: 1 !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-spacer {
    height: var(--xtel-ref-control-height) !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-actions {
    display: flex !important;
    justify-content: flex-end !important;
    gap: 16px !important;
    width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-button,
[data-xtel-page] .page-calls .xtel-filter-card button.xtel-filter-button,
[data-xtel-page] .page-calls .xtel-filter-card a.xtel-filter-button {
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: var(--xtel-ref-button-width) !important;
    min-width: var(--xtel-ref-button-width) !important;
    height: var(--xtel-ref-control-height) !important;
    min-height: var(--xtel-ref-control-height) !important;
    padding: 0 12px !important;
    border-radius: 0 !important;
    border: 1px solid var(--xtel-clean-border) !important;
    background: var(--xtel-clean-panel-soft) !important;
    color: var(--xtel-clean-text) !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    box-shadow: none !important;
    white-space: nowrap !important;
    text-transform: none !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-button-primary {
    background: #414765 !important;
    border-color: #414765 !important;
    color: #ffffff !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-actions .xtel-filter-button {
    width: var(--xtel-ref-action-width) !important;
    min-width: var(--xtel-ref-action-width) !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-footer {
    display: flex !important;
    align-items: flex-end !important;
    justify-content: space-between !important;
    gap: 24px !important;
    margin-top: 30px !important;
    width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-footer .xtel-filter-presets {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin: 0 !important;
    width: auto !important;
    max-width: none !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-footer .xtel-filter-presets .xtel-filter-button {
    width: auto !important;
    min-width: 0 !important;
    height: 32px !important;
    min-height: 32px !important;
    padding: 0 10px !important;
    font-size: 16px !important;
}

[data-xtel-page] .page-calls .xtel-filter-export-button {
    width: var(--xtel-ref-action-width) !important;
    min-width: var(--xtel-ref-action-width) !important;
}

@media (max-width: 1500px) {
    [data-xtel-page] .page-calls .xtel-filter-card {
        --xtel-ref-date-width: 190px !important;
        --xtel-ref-time-width: 116px !important;
        --xtel-ref-field-width: 300px !important;
        --xtel-ref-status-width: 300px !important;
        --xtel-ref-gap-x: 34px !important;
    }
}

@media (max-width: 1180px) {
    [data-xtel-page] .page-calls .xtel-calls-filter-reference {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 767px) {
    [data-xtel-page] .page-calls .xtel-filter-card {
        --xtel-ref-date-width: minmax(0, 1fr) !important;
        --xtel-ref-time-width: 96px !important;
        --xtel-ref-control-height: 46px !important;
    }

    [data-xtel-page] .page-calls .xtel-filter-card > .px-4.py-5,
    [data-xtel-page] .page-calls .xtel-filter-card > .px-4,
    [data-xtel-page] .page-calls .xtel-filter-card > .md\:px-6 {
        padding: 20px !important;
    }

    [data-xtel-page] .page-calls .xtel-calls-filter-reference,
    [data-xtel-page] .page-calls .xtel-calls-filter-footer {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
    }

    [data-xtel-page] .page-calls .xtel-calls-filter-actions {
        justify-content: stretch !important;
    }

    [data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-button,
    [data-xtel-page] .page-calls .xtel-filter-card button.xtel-filter-button,
    [data-xtel-page] .page-calls .xtel-filter-card a.xtel-filter-button {
        width: 100% !important;
        min-width: 0 !important;
    }
}

/* Calls filter final alignment v2. Must stay last. */
[data-xtel-page] .page-calls .xtel-filter-card {
    --xtel-calls-date-width: 255px !important;
    --xtel-calls-time-width: 140px !important;
    --xtel-calls-date-pair-width: 407px !important;
    --xtel-calls-select-width: 270px !important;
    --xtel-calls-button-width: 152px !important;
    --xtel-calls-gap: 16px !important;
    --xtel-calls-control-height: 54px !important;
}

[data-xtel-page] .page-calls .xtel-filter-card > .px-4.py-5,
[data-xtel-page] .page-calls .xtel-filter-card > .px-4,
[data-xtel-page] .page-calls .xtel-filter-card > .md\:px-6 {
    padding-left: 32px !important;
    padding-right: 32px !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-main {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-end !important;
    gap: var(--xtel-calls-gap) !important;
    width: 100% !important;
    max-width: none !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-main > .xtel-filter-field {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-main .xtel-filter-date-pair {
    display: grid !important;
    grid-template-columns: var(--xtel-calls-date-width) var(--xtel-calls-time-width) !important;
    gap: 12px !important;
    width: var(--xtel-calls-date-pair-width) !important;
    max-width: var(--xtel-calls-date-pair-width) !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-main .xtel-filter-field-select {
    width: var(--xtel-calls-select-width) !important;
    max-width: var(--xtel-calls-select-width) !important;
    flex-basis: var(--xtel-calls-select-width) !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-main .xtel-filter-action-field {
    width: var(--xtel-calls-button-width) !important;
    max-width: var(--xtel-calls-button-width) !important;
    flex-basis: var(--xtel-calls-button-width) !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-main .xtel-filter-action-field label {
    visibility: hidden !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-control,
[data-xtel-page] .page-calls .xtel-filter-card input.xtel-filter-control,
[data-xtel-page] .page-calls .xtel-filter-card select.xtel-filter-control,
[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-date-pair input,
[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-button {
    height: var(--xtel-calls-control-height) !important;
    min-height: var(--xtel-calls-control-height) !important;
    border-radius: 8px !important;
    line-height: 1 !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-main .xtel-filter-button {
    width: 100% !important;
    min-width: 0 !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-secondary {
    display: grid !important;
    grid-template-columns: var(--xtel-calls-date-pair-width) var(--xtel-calls-date-pair-width) minmax(0, 1fr) !important;
    gap: var(--xtel-calls-gap) !important;
    align-items: end !important;
    width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-secondary > .xtel-filter-field {
    width: var(--xtel-calls-date-pair-width) !important;
    max-width: var(--xtel-calls-date-pair-width) !important;
    flex-basis: var(--xtel-calls-date-pair-width) !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-secondary .xtel-filter-presets {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-secondary .xtel-filter-presets .xtel-filter-button {
    width: 100% !important;
    min-width: 0 !important;
}

@media (max-width: 1500px) {
    [data-xtel-page] .page-calls .xtel-filter-card {
        --xtel-calls-date-width: 210px !important;
        --xtel-calls-time-width: 112px !important;
        --xtel-calls-date-pair-width: 334px !important;
        --xtel-calls-select-width: 230px !important;
        --xtel-calls-button-width: 140px !important;
    }
}

@media (max-width: 1100px) {
    [data-xtel-page] .page-calls .xtel-calls-filter-secondary {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    [data-xtel-page] .page-calls .xtel-calls-filter-secondary .xtel-filter-presets {
        grid-column: 1 / -1 !important;
    }
}

@media (max-width: 767px) {
    [data-xtel-page] .page-calls .xtel-filter-card {
        --xtel-calls-date-width: minmax(0, 1fr) !important;
        --xtel-calls-time-width: 96px !important;
        --xtel-calls-date-pair-width: 100% !important;
        --xtel-calls-select-width: 100% !important;
        --xtel-calls-button-width: 100% !important;
        --xtel-calls-control-height: 48px !important;
    }

    [data-xtel-page] .page-calls .xtel-filter-card > .px-4.py-5,
    [data-xtel-page] .page-calls .xtel-filter-card > .px-4,
    [data-xtel-page] .page-calls .xtel-filter-card > .md\:px-6 {
        padding-left: 18px !important;
        padding-right: 18px !important;
    }

    [data-xtel-page] .page-calls .xtel-calls-filter-main,
    [data-xtel-page] .page-calls .xtel-calls-filter-secondary {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
    }

    [data-xtel-page] .page-calls .xtel-calls-filter-main > .xtel-filter-field,
    [data-xtel-page] .page-calls .xtel-calls-filter-secondary > .xtel-filter-field {
        width: 100% !important;
        max-width: 100% !important;
        flex-basis: 100% !important;
    }
}

/* Calls filter reference layout v6. Keep this block last. */
[data-xtel-page] .page-calls .xtel-filter-card {
    --xtel-ref-date-width: 214px !important;
    --xtel-ref-time-width: 132px !important;
    --xtel-ref-column-width: 360px !important;
    --xtel-ref-status-width: 360px !important;
    --xtel-ref-gap-x: 46px !important;
    --xtel-ref-gap-y: 18px !important;
    --xtel-ref-control-height: 44px !important;
    --xtel-ref-action-width: 144px !important;
}

[data-xtel-page] .page-calls .xtel-filter-card > .px-4.py-5,
[data-xtel-page] .page-calls .xtel-filter-card > .px-4,
[data-xtel-page] .page-calls .xtel-filter-card > .md\:px-6 {
    padding: 36px 44px 32px !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-reference {
    display: grid !important;
    grid-template-columns:
        calc(var(--xtel-ref-date-width) + var(--xtel-ref-time-width) + 16px)
        var(--xtel-ref-column-width)
        var(--xtel-ref-column-width)
        var(--xtel-ref-status-width) !important;
    column-gap: var(--xtel-ref-gap-x) !important;
    align-items: start !important;
    justify-content: start !important;
    width: max-content !important;
    max-width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-stack {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: var(--xtel-ref-gap-y) !important;
    min-width: 0 !important;
}

[data-xtel-page] .page-calls .xtel-filter-field {
    margin: 0 !important;
    min-width: 0 !important;
}

[data-xtel-page] .page-calls .xtel-filter-field label {
    margin: 0 0 8px !important;
    color: #cbd3df !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
}

[data-xtel-page] .page-calls .xtel-filter-date-pair {
    display: grid !important;
    grid-template-columns: var(--xtel-ref-date-width) var(--xtel-ref-time-width) !important;
    gap: 16px !important;
    width: 100% !important;
    max-width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-control,
[data-xtel-page] .page-calls .xtel-filter-card input.xtel-filter-control,
[data-xtel-page] .page-calls .xtel-filter-card select.xtel-filter-control {
    width: 100% !important;
    height: var(--xtel-ref-control-height) !important;
    min-height: var(--xtel-ref-control-height) !important;
    padding: 0 16px !important;
    border-radius: 6px !important;
    border: 1px solid #334050 !important;
    background-color: #1a2028 !important;
    color: #eef2f7 !important;
    font-size: 18px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-spacer {
    height: var(--xtel-ref-control-height) !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-actions {
    display: grid !important;
    grid-template-columns: repeat(2, var(--xtel-ref-action-width)) !important;
    gap: 16px !important;
    justify-content: end !important;
    width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-button,
[data-xtel-page] .page-calls .xtel-filter-card button.xtel-filter-button,
[data-xtel-page] .page-calls .xtel-filter-card a.xtel-filter-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: var(--xtel-ref-control-height) !important;
    min-height: var(--xtel-ref-control-height) !important;
    padding: 0 16px !important;
    border-radius: 6px !important;
    border: 1px solid #334050 !important;
    background-color: #1a2028 !important;
    color: #f2f5f9 !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-button-primary {
    border-color: #0b1b33 !important;
    background-color: #071326 !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-footer {
    display: flex !important;
    align-items: end !important;
    justify-content: space-between !important;
    gap: 24px !important;
    margin-top: 30px !important;
    width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-filter-presets {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    max-width: none !important;
}

[data-xtel-page] .page-calls .xtel-filter-presets .xtel-filter-button {
    width: auto !important;
    min-width: 102px !important;
}

[data-xtel-page] .page-calls .xtel-filter-export-button {
    width: 170px !important;
}

@media (max-width: 1700px) {
    [data-xtel-page] .page-calls .xtel-filter-card {
        --xtel-ref-date-width: 190px !important;
        --xtel-ref-time-width: 118px !important;
        --xtel-ref-column-width: 320px !important;
        --xtel-ref-status-width: 320px !important;
        --xtel-ref-gap-x: 34px !important;
    }
}

@media (max-width: 1380px) {
    [data-xtel-page] .page-calls .xtel-calls-filter-reference {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        width: 100% !important;
        row-gap: 20px !important;
    }
}

@media (max-width: 900px) {
    [data-xtel-page] .page-calls .xtel-filter-card > .px-4.py-5,
    [data-xtel-page] .page-calls .xtel-filter-card > .px-4,
    [data-xtel-page] .page-calls .xtel-filter-card > .md\:px-6 {
        padding: 24px 20px !important;
    }

    [data-xtel-page] .page-calls .xtel-calls-filter-reference,
    [data-xtel-page] .page-calls .xtel-filter-date-pair {
        grid-template-columns: minmax(0, 1fr) !important;
        width: 100% !important;
    }

    [data-xtel-page] .page-calls .xtel-calls-filter-footer,
    [data-xtel-page] .page-calls .xtel-filter-presets,
    [data-xtel-page] .page-calls .xtel-calls-filter-actions {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        width: 100% !important;
    }

    [data-xtel-page] .page-calls .xtel-filter-presets .xtel-filter-button,
    [data-xtel-page] .page-calls .xtel-filter-export-button {
        width: 100% !important;
        min-width: 0 !important;
    }
}

/* Calls filter reference layout v5. Must remain last. */
[data-xtel-page] .page-calls .xtel-filter-card {
    --xtel-ref-date-width: 214px !important;
    --xtel-ref-time-width: 132px !important;
    --xtel-ref-field-width: 360px !important;
    --xtel-ref-status-width: 360px !important;
    --xtel-ref-gap-x: 46px !important;
    --xtel-ref-gap-y: 18px !important;
    --xtel-ref-control-height: 44px !important;
    --xtel-ref-button-width: 140px !important;
    --xtel-ref-action-width: 144px !important;
}

[data-xtel-page] .page-calls .xtel-filter-card > .px-4.py-5,
[data-xtel-page] .page-calls .xtel-filter-card > .px-4,
[data-xtel-page] .page-calls .xtel-filter-card > .md\:px-6 {
    padding: 34px 46px 30px !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-reference {
    display: grid !important;
    grid-template-columns:
        calc(var(--xtel-ref-date-width) + var(--xtel-ref-time-width) + 16px)
        var(--xtel-ref-field-width)
        var(--xtel-ref-field-width)
        var(--xtel-ref-status-width) !important;
    column-gap: var(--xtel-ref-gap-x) !important;
    row-gap: var(--xtel-ref-gap-y) !important;
    align-items: start !important;
    width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-stack {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: var(--xtel-ref-gap-y) !important;
    width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-field,
[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-field-select,
[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-field-text {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: none !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-date-pair {
    display: grid !important;
    grid-template-columns: var(--xtel-ref-date-width) var(--xtel-ref-time-width) !important;
    gap: 16px !important;
    width: 100% !important;
    max-width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-filter-card label {
    margin-bottom: 8px !important;
    color: var(--xtel-clean-label) !important;
    font-size: 20px !important;
    font-weight: 600 !important;
    line-height: 1.15 !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-control,
[data-xtel-page] .page-calls .xtel-filter-card input.xtel-filter-control,
[data-xtel-page] .page-calls .xtel-filter-card select.xtel-filter-control,
[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-date-pair input {
    box-sizing: border-box !important;
    width: 100% !important;
    height: var(--xtel-ref-control-height) !important;
    min-height: var(--xtel-ref-control-height) !important;
    max-height: var(--xtel-ref-control-height) !important;
    padding: 0 14px !important;
    border-radius: 0 !important;
    border: 1px solid var(--xtel-clean-border) !important;
    background: var(--xtel-clean-control) !important;
    color: var(--xtel-clean-text) !important;
    font-size: 18px !important;
    line-height: var(--xtel-ref-control-height) !important;
    box-shadow: none !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-control::placeholder {
    color: var(--xtel-clean-subtle) !important;
    opacity: 1 !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-spacer {
    height: var(--xtel-ref-control-height) !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-actions {
    display: flex !important;
    justify-content: flex-end !important;
    gap: 16px !important;
    width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-button,
[data-xtel-page] .page-calls .xtel-filter-card button.xtel-filter-button,
[data-xtel-page] .page-calls .xtel-filter-card a.xtel-filter-button {
    box-sizing: border-box !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: var(--xtel-ref-button-width) !important;
    min-width: var(--xtel-ref-button-width) !important;
    height: var(--xtel-ref-control-height) !important;
    min-height: var(--xtel-ref-control-height) !important;
    padding: 0 12px !important;
    border-radius: 0 !important;
    border: 1px solid var(--xtel-clean-border) !important;
    background: var(--xtel-clean-panel-soft) !important;
    color: var(--xtel-clean-text) !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    box-shadow: none !important;
    white-space: nowrap !important;
    text-transform: none !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-button-primary {
    background: #414765 !important;
    border-color: #414765 !important;
    color: #ffffff !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-actions .xtel-filter-button {
    width: var(--xtel-ref-action-width) !important;
    min-width: var(--xtel-ref-action-width) !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-footer {
    display: flex !important;
    align-items: flex-end !important;
    justify-content: space-between !important;
    gap: 24px !important;
    margin-top: 30px !important;
    width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-footer .xtel-filter-presets {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin: 0 !important;
    width: auto !important;
    max-width: none !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-footer .xtel-filter-presets .xtel-filter-button {
    width: auto !important;
    min-width: 0 !important;
    height: 32px !important;
    min-height: 32px !important;
    padding: 0 10px !important;
    font-size: 16px !important;
}

[data-xtel-page] .page-calls .xtel-filter-export-button {
    width: var(--xtel-ref-action-width) !important;
    min-width: var(--xtel-ref-action-width) !important;
}

@media (max-width: 1500px) {
    [data-xtel-page] .page-calls .xtel-filter-card {
        --xtel-ref-date-width: 190px !important;
        --xtel-ref-time-width: 116px !important;
        --xtel-ref-field-width: 300px !important;
        --xtel-ref-status-width: 300px !important;
        --xtel-ref-gap-x: 34px !important;
    }
}

@media (max-width: 1180px) {
    [data-xtel-page] .page-calls .xtel-calls-filter-reference {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 767px) {
    [data-xtel-page] .page-calls .xtel-filter-card {
        --xtel-ref-date-width: minmax(0, 1fr) !important;
        --xtel-ref-time-width: 96px !important;
        --xtel-ref-control-height: 46px !important;
    }

    [data-xtel-page] .page-calls .xtel-filter-card > .px-4.py-5,
    [data-xtel-page] .page-calls .xtel-filter-card > .px-4,
    [data-xtel-page] .page-calls .xtel-filter-card > .md\:px-6 {
        padding: 20px !important;
    }

    [data-xtel-page] .page-calls .xtel-calls-filter-reference,
    [data-xtel-page] .page-calls .xtel-calls-filter-footer {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
    }

    [data-xtel-page] .page-calls .xtel-calls-filter-actions {
        justify-content: stretch !important;
    }

    [data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-button,
    [data-xtel-page] .page-calls .xtel-filter-card button.xtel-filter-button,
    [data-xtel-page] .page-calls .xtel-filter-card a.xtel-filter-button {
        width: 100% !important;
        min-width: 0 !important;
    }
}

/* Calls filter final alignment: mirror Destination Groups Stats rhythm. */
[data-xtel-page] .page-calls .xtel-filter-card {
    --xtel-calls-date-width: 255px;
    --xtel-calls-time-width: 140px;
    --xtel-calls-date-pair-width: 407px;
    --xtel-calls-select-width: 270px;
    --xtel-calls-button-width: 152px;
    --xtel-calls-gap: 16px;
    --xtel-calls-control-height: 54px;
}

[data-xtel-page] .page-calls .xtel-filter-card > .px-4.py-5,
[data-xtel-page] .page-calls .xtel-filter-card > .px-4,
[data-xtel-page] .page-calls .xtel-filter-card > .md\:px-6 {
    padding-left: 32px !important;
    padding-right: 32px !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-main {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-end !important;
    gap: var(--xtel-calls-gap) !important;
    width: 100% !important;
    max-width: none !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-main > .xtel-filter-field {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-main .xtel-filter-date-pair {
    display: grid !important;
    grid-template-columns: var(--xtel-calls-date-width) var(--xtel-calls-time-width) !important;
    gap: 12px !important;
    width: var(--xtel-calls-date-pair-width) !important;
    max-width: var(--xtel-calls-date-pair-width) !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-main .xtel-filter-field-select {
    width: var(--xtel-calls-select-width) !important;
    max-width: var(--xtel-calls-select-width) !important;
    flex-basis: var(--xtel-calls-select-width) !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-main .xtel-filter-action-field {
    width: var(--xtel-calls-button-width) !important;
    max-width: var(--xtel-calls-button-width) !important;
    flex-basis: var(--xtel-calls-button-width) !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-main .xtel-filter-action-field label {
    visibility: hidden !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-control,
[data-xtel-page] .page-calls .xtel-filter-card input.xtel-filter-control,
[data-xtel-page] .page-calls .xtel-filter-card select.xtel-filter-control,
[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-date-pair input,
[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-button {
    height: var(--xtel-calls-control-height) !important;
    min-height: var(--xtel-calls-control-height) !important;
    border-radius: 8px !important;
    line-height: 1 !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-main .xtel-filter-button {
    width: 100% !important;
    min-width: 0 !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-secondary {
    display: grid !important;
    grid-template-columns: var(--xtel-calls-date-pair-width) var(--xtel-calls-date-pair-width) minmax(0, 1fr) !important;
    gap: var(--xtel-calls-gap) !important;
    align-items: end !important;
    width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-secondary > .xtel-filter-field {
    width: var(--xtel-calls-date-pair-width) !important;
    max-width: var(--xtel-calls-date-pair-width) !important;
    flex-basis: var(--xtel-calls-date-pair-width) !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-secondary .xtel-filter-presets {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-secondary .xtel-filter-presets .xtel-filter-button {
    width: 100% !important;
    min-width: 0 !important;
}

@media (max-width: 1500px) {
    [data-xtel-page] .page-calls .xtel-filter-card {
        --xtel-calls-date-width: 210px;
        --xtel-calls-time-width: 112px;
        --xtel-calls-date-pair-width: 334px;
        --xtel-calls-select-width: 230px;
        --xtel-calls-button-width: 140px;
    }
}

@media (max-width: 1100px) {
    [data-xtel-page] .page-calls .xtel-calls-filter-secondary {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    [data-xtel-page] .page-calls .xtel-calls-filter-secondary .xtel-filter-presets {
        grid-column: 1 / -1 !important;
    }
}

@media (max-width: 767px) {
    [data-xtel-page] .page-calls .xtel-filter-card {
        --xtel-calls-date-width: minmax(0, 1fr);
        --xtel-calls-time-width: 96px;
        --xtel-calls-date-pair-width: 100%;
        --xtel-calls-select-width: 100%;
        --xtel-calls-button-width: 100%;
        --xtel-calls-control-height: 48px;
    }

    [data-xtel-page] .page-calls .xtel-filter-card > .px-4.py-5,
    [data-xtel-page] .page-calls .xtel-filter-card > .px-4,
    [data-xtel-page] .page-calls .xtel-filter-card > .md\:px-6 {
        padding-left: 18px !important;
        padding-right: 18px !important;
    }

    [data-xtel-page] .page-calls .xtel-calls-filter-main,
    [data-xtel-page] .page-calls .xtel-calls-filter-secondary {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
    }

    [data-xtel-page] .page-calls .xtel-calls-filter-main > .xtel-filter-field,
    [data-xtel-page] .page-calls .xtel-calls-filter-secondary > .xtel-filter-field {
        width: 100% !important;
        max-width: 100% !important;
        flex-basis: 100% !important;
    }
}

body:not(.bb-admin),
body[data-xtel-page],
.xtel-front-dark {
    background: var(--xtel-page-bg) !important;
    color: var(--xtel-text) !important;
}

body:not(.bb-admin) .text-gray-400,
body:not(.bb-admin) .text-gray-500,
body:not(.bb-admin) .text-gray-600,
body:not(.bb-admin) .text-slate-400,
body:not(.bb-admin) .text-slate-500,
body[data-xtel-page] .text-gray-400,
body[data-xtel-page] .text-gray-500,
body[data-xtel-page] .text-gray-600 {
    color: var(--xtel-muted) !important;
    opacity: 1 !important;
}

body:not(.bb-admin) h1,
body:not(.bb-admin) h2,
body:not(.bb-admin) h3,
body:not(.bb-admin) h4,
body:not(.bb-admin) h5,
body:not(.bb-admin) h6,
body[data-xtel-page] h1,
body[data-xtel-page] h2,
body[data-xtel-page] h3,
body[data-xtel-page] h4,
body[data-xtel-page] h5,
body[data-xtel-page] h6 {
    color: var(--xtel-text) !important;
}

.xtel-card,
.xpay-card,
.xtel-filter-card,
body[data-xtel-page] .rounded-xl.border,
body[data-xtel-page] .rounded-2xl.border {
    background: var(--xtel-surface) !important;
    border-color: var(--xtel-border) !important;
    color: var(--xtel-text) !important;
}

.xtel-data-table,
.xtel-data-table table,
.xtel-table,
body[data-xtel-page] table {
    color: var(--xtel-text) !important;
}

.xtel-data-table thead,
.xtel-table thead,
body[data-xtel-page] thead {
    background: var(--xtel-surface) !important;
    color: var(--xtel-text) !important;
}

.xtel-data-table tbody tr,
.xtel-table tbody tr,
body[data-xtel-page] tbody tr {
    border-color: var(--xtel-border) !important;
}

.xtel-data-table tbody tr:nth-child(even),
.xtel-table tbody tr:nth-child(even),
body[data-xtel-page] tbody tr:nth-child(even) {
    background: rgba(255, 255, 255, 0.035) !important;
}

.xtel-data-table tbody tr:nth-child(odd),
.xtel-table tbody tr:nth-child(odd),
body[data-xtel-page] tbody tr:nth-child(odd) {
    background: transparent !important;
}

.mor-destination-groups-total-row,
.mor-destination-groups-total-row *,
.mor-destination-groups-total-row td,
.mor-destination-groups-total-row td *,
.xtel-data-table tfoot,
.xtel-data-table tfoot *,
body[data-xtel-page] tfoot,
body[data-xtel-page] tfoot * {
    color: var(--xtel-text) !important;
    opacity: 1 !important;
}

.xtel-filter-card .xtel-filter-grid {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, var(--xtel-filter-field-width))) !important;
    width: max-content !important;
    max-width: 100% !important;
    column-gap: var(--xtel-filter-gap-x) !important;
    row-gap: var(--xtel-filter-gap-y) !important;
    align-items: end !important;
    justify-content: start !important;
}

.xtel-filter-card .xtel-filter-inline {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-end !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    max-width: 100% !important;
}

.xtel-filter-card .xtel-filter-field,
.xtel-filter-card .xtel-filter-select,
.xtel-filter-card .xtel-filter-search,
.xtel-filter-card .xtel-filter-date,
.xtel-filter-card .xtel-filter-grid > * {
    width: var(--xtel-filter-field-width) !important;
    max-width: var(--xtel-filter-field-width) !important;
    min-width: 0 !important;
    flex: 0 0 var(--xtel-filter-field-width) !important;
}

.xtel-filter-card .xtel-filter-date-pair {
    display: grid !important;
    grid-template-columns: var(--xtel-filter-date-width) var(--xtel-filter-time-width) !important;
    gap: 8px !important;
    width: var(--xtel-filter-field-width) !important;
    max-width: var(--xtel-filter-field-width) !important;
}

.xtel-filter-card label,
.xtel-filter-card .xtel-filter-label {
    display: block !important;
    margin-bottom: 7px !important;
    color: var(--xtel-text) !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
}

.xtel-filter-card input,
.xtel-filter-card select,
.xtel-filter-card .xtel-filter-control,
.xtel-filter-card .xtel-filter-date-pair input {
    width: 100% !important;
    height: var(--xtel-control-height) !important;
    min-height: var(--xtel-control-height) !important;
    max-height: var(--xtel-control-height) !important;
    padding: 0 14px !important;
    border-radius: var(--xtel-control-radius) !important;
    border: 1px solid #3b4048 !important;
    background: var(--xtel-surface-soft) !important;
    color: var(--xtel-text) !important;
    font-size: 15px !important;
    line-height: var(--xtel-control-height) !important;
    box-shadow: none !important;
}

.xtel-filter-card input::placeholder {
    color: #94a3b8 !important;
    opacity: 1 !important;
}

.xtel-filter-card .xtel-filter-presets,
.xtel-filter-card .xtel-filter-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px !important;
}

.xtel-filter-card .xtel-filter-button,
.xtel-filter-card button,
.xtel-filter-card a[role="button"] {
    height: var(--xtel-control-height) !important;
    min-height: var(--xtel-control-height) !important;
    min-width: 112px !important;
    padding: 0 16px !important;
    border-radius: var(--xtel-control-radius) !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    white-space: nowrap !important;
}

.xtel-filter-card .xtel-filter-actions .xtel-filter-button,
.xtel-filter-card .xtel-filter-actions button,
.xtel-filter-card .xtel-filter-actions a[role="button"] {
    min-width: var(--xtel-filter-button-width) !important;
}

.xtel-filter-card .xtel-filter-actions .xtel-filter-button:first-child,
.xtel-filter-card .xtel-filter-actions button:first-child {
    min-width: var(--xtel-filter-primary-button-width) !important;
}

#xtel-auth-modal.xtel-auth-modal,
#xtel-auth-modal.xtel-auth-modal.is-open {
    background: transparent !important;
    background-color: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

#xtel-auth-modal .xtel-auth-modal__backdrop {
    background: rgba(2, 6, 23, 0.18) !important;
    background-color: rgba(2, 6, 23, 0.18) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

body.xtel-auth-modal-open,
body.xtel-auth-modal-open > :not(#xtel-auth-modal),
body.xtel-auth-modal-open header,
body.xtel-auth-modal-open main,
body.xtel-auth-modal-open footer,
body.xtel-auth-modal-open [data-xtel-page] {
    visibility: visible !important;
    opacity: 1 !important;
    filter: none !important;
    transform: none !important;
}

.xtel-auth-modal__dialog {
    background: var(--xtel-surface) !important;
    border-color: var(--xtel-border) !important;
}

.xpay-summary .xpay-empty,
.xpay-summary .border-dashed,
.xpay-summary [class*="border-dashed"] {
    border-style: solid !important;
    border-color: transparent !important;
    background: transparent !important;
    box-shadow: none !important;
    outline: 0 !important;
}

.xpay-summary .xpay-empty {
    min-height: 0 !important;
    padding: 0 !important;
    border-width: 0 !important;
}

.xpay-summary {
    min-height: auto !important;
}

/* XTEL visual cleanup - 2026-05-19.
   Loaded after theme.css: keep the current minimal UI, but make controls and text consistent. */
:root {
    --xtel-clean-bg: #000000;
    --xtel-clean-panel: #11151c;
    --xtel-clean-panel-soft: #171b22;
    --xtel-clean-control: #1b2028;
    --xtel-clean-control-hover: #202630;
    --xtel-clean-border: #343b48;
    --xtel-clean-border-soft: #252b35;
    --xtel-clean-text: #f8fafc;
    --xtel-clean-label: #d5dde8;
    --xtel-clean-muted: #b8c2cf;
    --xtel-clean-subtle: #98a4b3;
    --xtel-clean-blue: #0f62fe;
    --xtel-clean-control-height: 44px;
    --xtel-clean-control-radius: 8px;
}

[data-xtel-page] .page-profile,
[data-xtel-page] .page-profile * {
    opacity: 1 !important;
}

[data-xtel-page] .page-profile,
[data-xtel-page] .page-profile .xtel-profile-static,
[data-xtel-page] .page-profile .text-gray-700,
[data-xtel-page] .page-profile .text-gray-800,
[data-xtel-page] .page-profile .text-gray-900 {
    color: var(--xtel-clean-text) !important;
}

[data-xtel-page] .page-profile label,
[data-xtel-page] .page-profile .text-gray-500,
[data-xtel-page] .page-profile .text-gray-600 {
    color: var(--xtel-clean-label) !important;
}

[data-xtel-page] .page-profile .xtel-profile-static {
    min-height: var(--xtel-clean-control-height) !important;
    color: var(--xtel-clean-muted) !important;
    font-weight: 500 !important;
}

[data-xtel-page] .page-profile input,
[data-xtel-page] .page-profile select {
    height: var(--xtel-clean-control-height) !important;
    min-height: var(--xtel-clean-control-height) !important;
    border: 1px solid var(--xtel-clean-border) !important;
    border-radius: var(--xtel-clean-control-radius) !important;
    background: var(--xtel-clean-control) !important;
    color: var(--xtel-clean-text) !important;
    box-shadow: none !important;
}

[data-xtel-page] .page-profile input:disabled,
[data-xtel-page] .page-profile input[readonly],
[data-xtel-page] .page-profile select:disabled {
    background: #151a22 !important;
    color: var(--xtel-clean-muted) !important;
    -webkit-text-fill-color: var(--xtel-clean-muted) !important;
}

[data-xtel-page] .page-profile input[type="number"] {
    appearance: textfield !important;
    -moz-appearance: textfield !important;
}

[data-xtel-page] .page-profile input[type="number"]::-webkit-outer-spin-button,
[data-xtel-page] .page-profile input[type="number"]::-webkit-inner-spin-button {
    margin: 0 !important;
    -webkit-appearance: none !important;
}

[data-xtel-page] .page-profile input[type="radio"] {
    width: 18px !important;
    height: 18px !important;
    min-height: 18px !important;
    accent-color: var(--xtel-clean-text) !important;
}

[data-xtel-page] .page-profile .xtel-btn-ghost,
[data-xtel-page] .page-profile .xtel-btn-dark {
    height: var(--xtel-clean-control-height) !important;
    min-width: 140px !important;
    border-radius: var(--xtel-clean-control-radius) !important;
    font-size: 15px !important;
    line-height: 1 !important;
}

[data-xtel-page] .page-profile .xtel-btn-ghost {
    border-color: var(--xtel-clean-border) !important;
    background: #ffffff !important;
    color: #111827 !important;
}

[data-xtel-page] .page-profile .xtel-btn-dark {
    border-color: #0f172a !important;
    background: #0f172a !important;
    color: #ffffff !important;
}

/* XTEL profile strict form layout - keep the current data, align it like the old billing form. */
[data-xtel-page] .page-profile {
    max-width: 1690px !important;
    margin: 0 auto !important;
}

[data-xtel-page] .page-profile .xtel-profile-page-title {
    color: var(--xtel-clean-text) !important;
    font-size: 30px !important;
    line-height: 1.2 !important;
    font-weight: 500 !important;
    letter-spacing: 0 !important;
    margin: 0 0 22px !important;
}

[data-xtel-page] .page-profile .xtel-profile-shell {
    background: #101419 !important;
    border: 1px solid #2b3340 !important;
    border-radius: 8px !important;
    box-shadow: none !important;
    padding: 34px 42px 32px !important;
}

[data-xtel-page] .page-profile .xtel-profile-grid {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr) !important;
    column-gap: 48px !important;
    row-gap: 34px !important;
    align-items: start !important;
}

[data-xtel-page] .page-profile .xtel-profile-card {
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
    box-shadow: none !important;
    padding: 0 !important;
    height: auto !important;
}

[data-xtel-page] .page-profile .xtel-profile-section-title {
    background: #1b2027 !important;
    border: 1px solid #303846 !important;
    border-radius: 0 !important;
    padding: 9px 14px !important;
    margin: 0 0 24px !important;
}

[data-xtel-page] .page-profile .xtel-profile-section-title h4 {
    color: #f4f7fb !important;
    font-size: 20px !important;
    line-height: 1.2 !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
    margin: 0 !important;
}

[data-xtel-page] .page-profile .xtel-profile-form-grid,
[data-xtel-page] .page-profile .xtel-profile-form-grid--wide {
    display: grid !important;
    grid-template-columns: 260px minmax(260px, 360px) !important;
    gap: 12px 34px !important;
    align-items: center !important;
}

[data-xtel-page] .page-profile label {
    color: #c8d0dc !important;
    font-size: 18px !important;
    line-height: 1.25 !important;
    font-weight: 400 !important;
    letter-spacing: 0 !important;
}

[data-xtel-page] .page-profile .xtel-profile-static {
    min-height: 38px !important;
    color: #edf2f7 !important;
    font-size: 18px !important;
    line-height: 1.25 !important;
    font-weight: 400 !important;
}

[data-xtel-page] .page-profile input,
[data-xtel-page] .page-profile select {
    width: 100% !important;
    height: 38px !important;
    min-height: 38px !important;
    border: 1px solid #384252 !important;
    border-radius: 0 !important;
    background: #151a21 !important;
    color: #f3f6fa !important;
    font-size: 17px !important;
    line-height: 1.2 !important;
    box-shadow: none !important;
}

[data-xtel-page] .page-profile input:disabled,
[data-xtel-page] .page-profile input[readonly],
[data-xtel-page] .page-profile select:disabled {
    background: #171c23 !important;
    color: #cfd7e2 !important;
    -webkit-text-fill-color: #cfd7e2 !important;
}

[data-xtel-page] .page-profile input[type="radio"] {
    width: 18px !important;
    height: 18px !important;
    min-height: 18px !important;
    accent-color: #dbe4f0 !important;
}

[data-xtel-page] .page-profile .xtel-profile-actions {
    justify-content: flex-start !important;
    padding-top: 10px !important;
}

[data-xtel-page] .page-profile .xtel-btn-ghost,
[data-xtel-page] .page-profile .xtel-btn-dark {
    height: 38px !important;
    min-width: 128px !important;
    padding: 0 18px !important;
    border-radius: 4px !important;
    font-size: 16px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
}

[data-xtel-page] .page-profile .xtel-btn-ghost {
    background: #e5e7eb !important;
    border-color: #e5e7eb !important;
    color: #1f2933 !important;
}

[data-xtel-page] .page-profile .xtel-btn-dark {
    background: #172235 !important;
    border-color: #172235 !important;
    color: #ffffff !important;
}

[data-xtel-page] .page-profile .xtel-profile-form-grid .space-y-3 {
    gap: 9px !important;
}

[data-xtel-page] .page-profile .xtel-profile-form-grid .text-base,
[data-xtel-page] .page-profile .xtel-profile-form-grid span {
    color: #cfd7e2 !important;
    font-size: 17px !important;
}

@media (max-width: 1279px) {
    [data-xtel-page] .page-profile .xtel-profile-shell {
        padding: 28px 24px !important;
    }

    [data-xtel-page] .page-profile .xtel-profile-grid {
        grid-template-columns: 1fr !important;
    }

    [data-xtel-page] .page-profile .xtel-profile-form-grid,
    [data-xtel-page] .page-profile .xtel-profile-form-grid--wide {
        grid-template-columns: minmax(180px, 240px) minmax(240px, 1fr) !important;
    }
}

@media (max-width: 767px) {
    [data-xtel-page] .page-profile .xtel-profile-form-grid,
    [data-xtel-page] .page-profile .xtel-profile-form-grid--wide {
        grid-template-columns: 1fr !important;
        gap: 7px !important;
    }
}

[data-xtel-page] .page-calls .xtel-filter-card {
    --xtel-clean-date-width: 204px;
    --xtel-clean-time-width: 104px;
    --xtel-clean-field-width: 324px;
    --xtel-clean-gap: 16px;
    background: var(--xtel-clean-panel) !important;
    border-color: var(--xtel-clean-border-soft) !important;
    border-radius: 12px !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-grid {
    display: grid !important;
    grid-template-columns: repeat(3, var(--xtel-clean-field-width)) !important;
    gap: 18px var(--xtel-clean-gap) !important;
    align-items: end !important;
    width: calc((var(--xtel-clean-field-width) * 3) + (var(--xtel-clean-gap) * 2)) !important;
    max-width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-field,
[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-field-select,
[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-field-text {
    width: var(--xtel-clean-field-width) !important;
    max-width: var(--xtel-clean-field-width) !important;
    flex: 0 0 var(--xtel-clean-field-width) !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-date-pair {
    display: grid !important;
    grid-template-columns: var(--xtel-clean-date-width) var(--xtel-clean-time-width) !important;
    gap: var(--xtel-clean-gap) !important;
    width: var(--xtel-clean-field-width) !important;
    max-width: var(--xtel-clean-field-width) !important;
}

[data-xtel-page] .page-calls .xtel-filter-card label {
    margin-bottom: 8px !important;
    color: var(--xtel-clean-label) !important;
    font-size: 14px !important;
    line-height: 1.25 !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-control,
[data-xtel-page] .page-calls .xtel-filter-card input.xtel-filter-control,
[data-xtel-page] .page-calls .xtel-filter-card select.xtel-filter-control,
[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-date-pair input {
    box-sizing: border-box !important;
    height: var(--xtel-clean-control-height) !important;
    min-height: var(--xtel-clean-control-height) !important;
    max-height: var(--xtel-clean-control-height) !important;
    padding: 0 14px !important;
    border: 1px solid var(--xtel-clean-border) !important;
    border-radius: var(--xtel-clean-control-radius) !important;
    background: var(--xtel-clean-control) !important;
    color: var(--xtel-clean-text) !important;
    font-size: 15px !important;
    line-height: var(--xtel-clean-control-height) !important;
    box-shadow: none !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-control::placeholder {
    color: var(--xtel-clean-subtle) !important;
    opacity: 1 !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-presets,
[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-actions {
    display: grid !important;
    align-items: center !important;
    gap: var(--xtel-clean-gap) !important;
    width: calc((var(--xtel-clean-field-width) * 3) + (var(--xtel-clean-gap) * 2)) !important;
    max-width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-presets {
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-actions {
    grid-template-columns: repeat(3, var(--xtel-clean-field-width)) !important;
    padding-top: 16px !important;
    border-top: 1px solid var(--xtel-clean-border-soft) !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-button,
[data-xtel-page] .page-calls .xtel-filter-card button.xtel-filter-button,
[data-xtel-page] .page-calls .xtel-filter-card a.xtel-filter-button {
    box-sizing: border-box !important;
    height: var(--xtel-clean-control-height) !important;
    min-height: var(--xtel-clean-control-height) !important;
    width: 100% !important;
    min-width: 0 !important;
    padding: 0 18px !important;
    border: 1px solid var(--xtel-clean-border) !important;
    border-radius: var(--xtel-clean-control-radius) !important;
    background: var(--xtel-clean-panel-soft) !important;
    color: var(--xtel-clean-text) !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    box-shadow: none !important;
    text-transform: none !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-presets .xtel-filter-button {
    width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-actions .xtel-filter-button {
    width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-button-primary {
    background: var(--xtel-clean-blue) !important;
    border-color: var(--xtel-clean-blue) !important;
    color: #ffffff !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-button:hover {
    background: var(--xtel-clean-control-hover) !important;
    border-color: #465061 !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-button-primary:hover {
    background: #1f6fd3 !important;
    border-color: #1f6fd3 !important;
}

[data-xtel-page] .page-trunks .xtel-data-table-pagination:not(.xtel-trunks-primary-pagination),
[data-xtel-page] .page-trunks .xtel-trunks-primary-pagination ~ *,
[data-xtel-page] .page-trunks .xtel-desktop-pagination ~ * {
    display: none !important;
}

@media (max-width: 1170px) {
    [data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-grid {
        grid-template-columns: repeat(2, var(--xtel-clean-field-width)) !important;
        width: calc((var(--xtel-clean-field-width) * 2) + var(--xtel-clean-gap)) !important;
    }

    [data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-presets,
    [data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-actions {
        width: calc((var(--xtel-clean-field-width) * 2) + var(--xtel-clean-gap)) !important;
    }

    [data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-actions {
        grid-template-columns: repeat(2, var(--xtel-clean-field-width)) !important;
    }
}

@media (max-width: 767px) {
    [data-xtel-page] .page-calls .xtel-filter-card {
        --xtel-clean-date-width: minmax(0, 1fr);
        --xtel-clean-time-width: 96px;
        --xtel-clean-field-width: 100%;
        --xtel-clean-gap: 10px;
    }

    [data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-grid {
        grid-template-columns: minmax(0, 1fr) !important;
        width: 100% !important;
    }

    [data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-presets,
    [data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-actions {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        width: 100% !important;
    }

    [data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-field,
    [data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-field-select,
    [data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-field-text,
    [data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-date-pair {
        width: 100% !important;
        max-width: 100% !important;
        flex-basis: 100% !important;
    }

    [data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-presets .xtel-filter-button,
    [data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-actions .xtel-filter-button {
        width: 100% !important;
    }
}

@media (min-width: 768px) {
    main:has(.xtel-trunks-primary-pagination) .xtel-data-table-pagination:not(.xtel-trunks-primary-pagination),
    main:has(.xtel-trunks-primary-pagination) .xtel-trunks-primary-pagination ~ .xtel-data-table-pagination,
    .page-trunks .xtel-data-table-pagination:not(.xtel-trunks-primary-pagination),
    .page-trunks .xtel-trunks-primary-pagination ~ .xtel-data-table-pagination,
    .page-trunks .xtel-data-table-pagination + .xtel-data-table-pagination,
    .page-trunks .xtel-desktop-pagination + .xtel-desktop-pagination {
        display: none !important;
    }

    .page-trunks .xtel-trunks-primary-pagination {
        display: flex !important;
    }
}

@media (max-width: 767px) {
    .xtel-filter-card {
        --xtel-filter-field-width: 100%;
        --xtel-filter-time-width: 92px;
        --xtel-filter-gap-x: 0;
        --xtel-filter-gap-y: 14px;
    }

    .xtel-filter-card .xtel-filter-grid,
    .xtel-filter-card .xtel-filter-inline {
        display: grid !important;
        grid-template-columns: 1fr !important;
        width: 100% !important;
        gap: var(--xtel-filter-gap-y) !important;
    }

    .xtel-filter-card .xtel-filter-field,
    .xtel-filter-card .xtel-filter-select,
    .xtel-filter-card .xtel-filter-search,
    .xtel-filter-card .xtel-filter-date,
    .xtel-filter-card .xtel-filter-date-pair {
        width: 100% !important;
        max-width: 100% !important;
        flex-basis: 100% !important;
    }

    .xtel-filter-card .xtel-filter-date-pair {
        grid-template-columns: minmax(0, 1fr) var(--xtel-filter-time-width) !important;
    }

    .xtel-filter-card .xtel-filter-presets,
    .xtel-filter-card .xtel-filter-actions {
        display: flex !important;
        gap: 10px !important;
    }

    .xtel-filter-card .xtel-filter-button,
    .xtel-filter-card button,
    .xtel-filter-card a[role="button"] {
        flex: 1 1 calc(50% - 5px) !important;
        min-width: 0 !important;
    }
}

/* Calls filter final alignment v3. This is intentionally the last override. */
[data-xtel-page] .page-calls .xtel-filter-card {
    --xtel-calls-date-width: 255px !important;
    --xtel-calls-time-width: 140px !important;
    --xtel-calls-date-pair-width: 407px !important;
    --xtel-calls-select-width: 270px !important;
    --xtel-calls-button-width: 152px !important;
    --xtel-calls-gap: 16px !important;
    --xtel-calls-control-height: 54px !important;
}

[data-xtel-page] .page-calls .xtel-filter-card > .px-4.py-5,
[data-xtel-page] .page-calls .xtel-filter-card > .px-4,
[data-xtel-page] .page-calls .xtel-filter-card > .md\:px-6 {
    padding-left: 32px !important;
    padding-right: 32px !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-main {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-end !important;
    gap: var(--xtel-calls-gap) !important;
    width: 100% !important;
    max-width: none !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-main > .xtel-filter-field {
    flex: 0 0 auto !important;
    width: auto !important;
    max-width: none !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-main .xtel-filter-date-pair {
    display: grid !important;
    grid-template-columns: var(--xtel-calls-date-width) var(--xtel-calls-time-width) !important;
    gap: 12px !important;
    width: var(--xtel-calls-date-pair-width) !important;
    max-width: var(--xtel-calls-date-pair-width) !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-main .xtel-filter-field-select {
    width: var(--xtel-calls-select-width) !important;
    max-width: var(--xtel-calls-select-width) !important;
    flex-basis: var(--xtel-calls-select-width) !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-main .xtel-filter-action-field {
    width: var(--xtel-calls-button-width) !important;
    max-width: var(--xtel-calls-button-width) !important;
    flex-basis: var(--xtel-calls-button-width) !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-main .xtel-filter-action-field label {
    visibility: hidden !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-control,
[data-xtel-page] .page-calls .xtel-filter-card input.xtel-filter-control,
[data-xtel-page] .page-calls .xtel-filter-card select.xtel-filter-control,
[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-date-pair input,
[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-button {
    height: var(--xtel-calls-control-height) !important;
    min-height: var(--xtel-calls-control-height) !important;
    border-radius: 8px !important;
    line-height: 1 !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-main .xtel-filter-button {
    width: 100% !important;
    min-width: 0 !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-secondary {
    display: grid !important;
    grid-template-columns: var(--xtel-calls-date-pair-width) var(--xtel-calls-date-pair-width) minmax(0, 1fr) !important;
    gap: var(--xtel-calls-gap) !important;
    align-items: end !important;
    width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-secondary > .xtel-filter-field {
    width: var(--xtel-calls-date-pair-width) !important;
    max-width: var(--xtel-calls-date-pair-width) !important;
    flex-basis: var(--xtel-calls-date-pair-width) !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-secondary .xtel-filter-presets {
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-secondary .xtel-filter-presets .xtel-filter-button {
    width: 100% !important;
    min-width: 0 !important;
}

@media (max-width: 1500px) {
    [data-xtel-page] .page-calls .xtel-filter-card {
        --xtel-calls-date-width: 210px !important;
        --xtel-calls-time-width: 112px !important;
        --xtel-calls-date-pair-width: 334px !important;
        --xtel-calls-select-width: 230px !important;
        --xtel-calls-button-width: 140px !important;
    }
}

@media (max-width: 1100px) {
    [data-xtel-page] .page-calls .xtel-calls-filter-secondary {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    [data-xtel-page] .page-calls .xtel-calls-filter-secondary .xtel-filter-presets {
        grid-column: 1 / -1 !important;
    }
}

@media (max-width: 767px) {
    [data-xtel-page] .page-calls .xtel-filter-card {
        --xtel-calls-date-width: minmax(0, 1fr) !important;
        --xtel-calls-time-width: 96px !important;
        --xtel-calls-date-pair-width: 100% !important;
        --xtel-calls-select-width: 100% !important;
        --xtel-calls-button-width: 100% !important;
        --xtel-calls-control-height: 48px !important;
    }

    [data-xtel-page] .page-calls .xtel-filter-card > .px-4.py-5,
    [data-xtel-page] .page-calls .xtel-filter-card > .px-4,
    [data-xtel-page] .page-calls .xtel-filter-card > .md\:px-6 {
        padding-left: 18px !important;
        padding-right: 18px !important;
    }

    [data-xtel-page] .page-calls .xtel-calls-filter-main,
    [data-xtel-page] .page-calls .xtel-calls-filter-secondary {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
    }

    [data-xtel-page] .page-calls .xtel-calls-filter-main > .xtel-filter-field,
    [data-xtel-page] .page-calls .xtel-calls-filter-secondary > .xtel-filter-field {
        width: 100% !important;
        max-width: 100% !important;
        flex-basis: 100% !important;
    }
}

/* Calls filter reference layout v7. Final override, must stay last. */
[data-xtel-page] .page-calls .xtel-filter-card {
    --xtel-ref-date-width: 214px !important;
    --xtel-ref-time-width: 132px !important;
    --xtel-ref-column-width: 360px !important;
    --xtel-ref-status-width: 360px !important;
    --xtel-ref-gap-x: 46px !important;
    --xtel-ref-gap-y: 18px !important;
    --xtel-ref-control-height: 44px !important;
    --xtel-ref-action-width: 144px !important;
}

[data-xtel-page] .page-calls .xtel-filter-card > .px-4.py-5,
[data-xtel-page] .page-calls .xtel-filter-card > .px-4,
[data-xtel-page] .page-calls .xtel-filter-card > .md\:px-6 {
    padding: 36px 44px 32px !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-reference {
    display: grid !important;
    grid-template-columns:
        calc(var(--xtel-ref-date-width) + var(--xtel-ref-time-width) + 16px)
        var(--xtel-ref-column-width)
        var(--xtel-ref-column-width)
        var(--xtel-ref-status-width) !important;
    column-gap: var(--xtel-ref-gap-x) !important;
    align-items: start !important;
    justify-content: start !important;
    width: max-content !important;
    max-width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-stack {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: var(--xtel-ref-gap-y) !important;
    min-width: 0 !important;
}

[data-xtel-page] .page-calls .xtel-filter-field {
    margin: 0 !important;
    min-width: 0 !important;
}

[data-xtel-page] .page-calls .xtel-filter-field label {
    margin: 0 0 8px !important;
    color: #cbd3df !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 1.2 !important;
}

[data-xtel-page] .page-calls .xtel-filter-date-pair {
    display: grid !important;
    grid-template-columns: var(--xtel-ref-date-width) var(--xtel-ref-time-width) !important;
    gap: 16px !important;
    width: 100% !important;
    max-width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-control,
[data-xtel-page] .page-calls .xtel-filter-card input.xtel-filter-control,
[data-xtel-page] .page-calls .xtel-filter-card select.xtel-filter-control {
    width: 100% !important;
    height: var(--xtel-ref-control-height) !important;
    min-height: var(--xtel-ref-control-height) !important;
    padding: 0 16px !important;
    border-radius: 6px !important;
    border: 1px solid #334050 !important;
    background-color: #1a2028 !important;
    color: #eef2f7 !important;
    font-size: 18px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-spacer {
    height: var(--xtel-ref-control-height) !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-actions {
    display: grid !important;
    grid-template-columns: repeat(2, var(--xtel-ref-action-width)) !important;
    gap: 16px !important;
    justify-content: end !important;
    width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-button,
[data-xtel-page] .page-calls .xtel-filter-card button.xtel-filter-button,
[data-xtel-page] .page-calls .xtel-filter-card a.xtel-filter-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: var(--xtel-ref-control-height) !important;
    min-height: var(--xtel-ref-control-height) !important;
    padding: 0 16px !important;
    border-radius: 6px !important;
    border: 1px solid #334050 !important;
    background-color: #1a2028 !important;
    color: #f2f5f9 !important;
    font-size: 17px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-button-primary {
    border-color: #0b1b33 !important;
    background-color: #071326 !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-footer {
    display: flex !important;
    align-items: end !important;
    justify-content: space-between !important;
    gap: 24px !important;
    margin-top: 30px !important;
    width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-filter-presets {
    display: flex !important;
    flex-wrap: nowrap !important;
    gap: 8px !important;
    max-width: none !important;
}

[data-xtel-page] .page-calls .xtel-filter-presets .xtel-filter-button {
    width: auto !important;
    min-width: 102px !important;
}

[data-xtel-page] .page-calls .xtel-filter-export-button {
    width: 170px !important;
}

@media (max-width: 1700px) {
    [data-xtel-page] .page-calls .xtel-filter-card {
        --xtel-ref-date-width: 190px !important;
        --xtel-ref-time-width: 118px !important;
        --xtel-ref-column-width: 320px !important;
        --xtel-ref-status-width: 320px !important;
        --xtel-ref-gap-x: 34px !important;
    }
}

@media (max-width: 1380px) {
    [data-xtel-page] .page-calls .xtel-calls-filter-reference {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        width: 100% !important;
        row-gap: 20px !important;
    }
}

@media (max-width: 900px) {
    [data-xtel-page] .page-calls .xtel-filter-card > .px-4.py-5,
    [data-xtel-page] .page-calls .xtel-filter-card > .px-4,
    [data-xtel-page] .page-calls .xtel-filter-card > .md\:px-6 {
        padding: 24px 20px !important;
    }

    [data-xtel-page] .page-calls .xtel-calls-filter-reference,
    [data-xtel-page] .page-calls .xtel-filter-date-pair {
        grid-template-columns: minmax(0, 1fr) !important;
        width: 100% !important;
    }

    [data-xtel-page] .page-calls .xtel-calls-filter-footer,
    [data-xtel-page] .page-calls .xtel-filter-presets,
    [data-xtel-page] .page-calls .xtel-calls-filter-actions {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) !important;
        width: 100% !important;
    }

    [data-xtel-page] .page-calls .xtel-filter-presets .xtel-filter-button,
    [data-xtel-page] .page-calls .xtel-filter-export-button {
        width: 100% !important;
        min-width: 0 !important;
    }
}

/* Calls filter reference layout v8. Footer actions aligned to the reference. */
[data-xtel-page] .page-calls .xtel-calls-filter-footer {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) auto !important;
    align-items: end !important;
    gap: 24px !important;
    margin-top: 30px !important;
    width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-footer .xtel-filter-presets {
    justify-self: start !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-footer .xtel-calls-filter-actions {
    display: grid !important;
    grid-template-columns: 170px 144px 144px !important;
    gap: 16px !important;
    justify-self: end !important;
    width: auto !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-action-stack .xtel-calls-filter-actions {
    display: none !important;
}

@media (max-width: 1180px) {
    [data-xtel-page] .page-calls .xtel-calls-filter-footer {
        grid-template-columns: minmax(0, 1fr) !important;
    }

    [data-xtel-page] .page-calls .xtel-calls-filter-footer .xtel-calls-filter-actions {
        justify-self: start !important;
    }
}

@media (max-width: 900px) {
    [data-xtel-page] .page-calls .xtel-calls-filter-footer .xtel-calls-filter-actions {
        grid-template-columns: minmax(0, 1fr) !important;
        width: 100% !important;
    }
}

/* Calls filter reference layout v9. Prevent old flex button rules from stretching presets. */
[data-xtel-page] .page-calls .xtel-calls-filter-footer .xtel-filter-presets .xtel-filter-button {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 102px !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-footer .xtel-calls-filter-actions .xtel-filter-button {
    flex: none !important;
    width: 100% !important;
    min-width: 0 !important;
}

/* Calls filter reference layout v10. Fixed-size quick preset buttons like the reference. */
[data-xtel-page] .page-calls .xtel-calls-filter-footer .xtel-filter-presets {
    display: grid !important;
    grid-template-columns: repeat(4, 118px) !important;
    gap: 8px !important;
    width: auto !important;
    max-width: none !important;
    justify-self: start !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-footer .xtel-filter-presets .xtel-filter-button,
[data-xtel-page] .page-calls .xtel-filter-card .xtel-calls-filter-footer .xtel-filter-presets .xtel-filter-button {
    flex: 0 0 118px !important;
    width: 118px !important;
    min-width: 118px !important;
    max-width: 118px !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
}

/* Calls filter reference layout v11. Real container-fit correction. */
[data-xtel-page] .page-calls .xtel-filter-card {
    --xtel-ref-date-width: 260px !important;
    --xtel-ref-time-width: 128px !important;
    --xtel-ref-column-width: 360px !important;
    --xtel-ref-source-width: 440px !important;
    --xtel-ref-status-width: 280px !important;
    --xtel-ref-gap-x: 22px !important;
    --xtel-ref-gap-y: 18px !important;
    --xtel-ref-control-height: 48px !important;
    --xtel-ref-button-height: 44px !important;
}

[data-xtel-page] .page-calls .xtel-filter-card > .px-4.py-5,
[data-xtel-page] .page-calls .xtel-filter-card > .px-4,
[data-xtel-page] .page-calls .xtel-filter-card > .md\:px-6 {
    padding: 34px 40px 32px !important;
    overflow: hidden !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-reference {
    display: grid !important;
    grid-template-columns:
        calc(var(--xtel-ref-date-width) + var(--xtel-ref-time-width) + 12px)
        var(--xtel-ref-column-width)
        var(--xtel-ref-source-width)
        var(--xtel-ref-status-width) !important;
    column-gap: var(--xtel-ref-gap-x) !important;
    row-gap: 0 !important;
    align-items: start !important;
    justify-content: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
}

[data-xtel-page] .page-calls .xtel-filter-date-pair {
    grid-template-columns: var(--xtel-ref-date-width) var(--xtel-ref-time-width) !important;
    gap: 12px !important;
    width: 100% !important;
    max-width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-stack,
[data-xtel-page] .page-calls .xtel-filter-field,
[data-xtel-page] .page-calls .xtel-filter-control {
    min-width: 0 !important;
    max-width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-filter-field label {
    color: #cbd3df !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 1.15 !important;
    margin: 0 0 10px !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-control,
[data-xtel-page] .page-calls .xtel-filter-card input.xtel-filter-control,
[data-xtel-page] .page-calls .xtel-filter-card select.xtel-filter-control {
    height: var(--xtel-ref-control-height) !important;
    min-height: var(--xtel-ref-control-height) !important;
    padding: 0 18px !important;
    border-radius: 6px !important;
    font-size: 20px !important;
    font-weight: 500 !important;
    line-height: 1 !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-footer {
    display: grid !important;
    grid-template-columns: auto 1fr !important;
    align-items: end !important;
    column-gap: 24px !important;
    margin-top: 34px !important;
    width: 100% !important;
    max-width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-footer .xtel-filter-presets {
    display: grid !important;
    grid-template-columns: repeat(4, 160px) !important;
    gap: 12px !important;
    justify-self: start !important;
    width: auto !important;
}

[data-xtel-page] .page-calls .xtel-calls-filter-footer .xtel-calls-filter-actions {
    display: grid !important;
    grid-template-columns: 230px 196px 196px !important;
    gap: 20px !important;
    justify-self: end !important;
    width: auto !important;
    max-width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-filter-card .xtel-filter-button,
[data-xtel-page] .page-calls .xtel-filter-card button.xtel-filter-button,
[data-xtel-page] .page-calls .xtel-filter-card a.xtel-filter-button,
[data-xtel-page] .page-calls .xtel-calls-filter-footer .xtel-filter-presets .xtel-filter-button,
[data-xtel-page] .page-calls .xtel-calls-filter-footer .xtel-calls-filter-actions .xtel-filter-button {
    flex: none !important;
    width: 100% !important;
    height: var(--xtel-ref-button-height) !important;
    min-height: var(--xtel-ref-button-height) !important;
    max-height: var(--xtel-ref-button-height) !important;
    padding: 0 14px !important;
    border-radius: 6px !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
}

@media (max-width: 1700px) {
    [data-xtel-page] .page-calls .xtel-filter-card {
        --xtel-ref-date-width: 230px !important;
        --xtel-ref-time-width: 116px !important;
        --xtel-ref-column-width: 330px !important;
        --xtel-ref-source-width: 390px !important;
        --xtel-ref-status-width: 260px !important;
        --xtel-ref-gap-x: 20px !important;
    }

    [data-xtel-page] .page-calls .xtel-calls-filter-footer .xtel-filter-presets {
        grid-template-columns: repeat(4, 136px) !important;
        gap: 10px !important;
    }

    [data-xtel-page] .page-calls .xtel-calls-filter-footer .xtel-calls-filter-actions {
        grid-template-columns: 190px 164px 164px !important;
        gap: 16px !important;
    }
}

/* Calls filter now reuses the shared stats filter system. Keep this block last. */
[data-xtel-page] .page-calls .xtel-calls-stats-filter {
    --xtel-control-height: 40px !important;
    --xtel-control-radius: 7px !important;
    --xtel-filter-date-width: 188px !important;
    --xtel-filter-time-width: 104px !important;
    --xtel-filter-field-width: 304px !important;
    --xtel-filter-button-width: 128px !important;
    --xtel-filter-primary-button-width: 150px !important;
    padding: 24px !important;
    overflow: visible !important;
}

[data-xtel-page] .page-calls .xtel-calls-stats-filter > .flex {
    display: flex !important;
    flex-wrap: wrap !important;
    justify-content: space-between !important;
    align-items: flex-end !important;
    gap: 16px !important;
}

[data-xtel-page] .page-calls .xtel-calls-stats-filter .xtel-filter-inline {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: flex-end !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    width: auto !important;
    max-width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-calls-stats-filter .xtel-filter-field,
[data-xtel-page] .page-calls .xtel-calls-stats-filter .xtel-filter-field-select,
[data-xtel-page] .page-calls .xtel-calls-stats-filter .xtel-filter-field-text {
    width: var(--xtel-filter-field-width) !important;
    max-width: var(--xtel-filter-field-width) !important;
    min-width: 0 !important;
    flex: 0 0 var(--xtel-filter-field-width) !important;
    margin: 0 !important;
}

[data-xtel-page] .page-calls .xtel-calls-stats-filter .xtel-filter-date-pair {
    display: grid !important;
    grid-template-columns: var(--xtel-filter-date-width) var(--xtel-filter-time-width) !important;
    gap: 8px !important;
    width: var(--xtel-filter-field-width) !important;
    max-width: var(--xtel-filter-field-width) !important;
}

[data-xtel-page] .page-calls .xtel-calls-stats-filter label {
    display: block !important;
    margin: 0 0 7px !important;
    color: var(--xtel-text) !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
}

[data-xtel-page] .page-calls .xtel-calls-stats-filter input,
[data-xtel-page] .page-calls .xtel-calls-stats-filter select,
[data-xtel-page] .page-calls .xtel-calls-stats-filter .xtel-filter-control,
[data-xtel-page] .page-calls .xtel-calls-stats-filter .xtel-filter-date-pair input {
    width: 100% !important;
    height: var(--xtel-control-height) !important;
    min-height: var(--xtel-control-height) !important;
    max-height: var(--xtel-control-height) !important;
    padding: 0 14px !important;
    border-radius: var(--xtel-control-radius) !important;
    border: 1px solid #3b4048 !important;
    background: var(--xtel-surface-soft) !important;
    color: var(--xtel-text) !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    line-height: var(--xtel-control-height) !important;
    box-shadow: none !important;
}

[data-xtel-page] .page-calls .xtel-calls-stats-filter input::placeholder {
    color: #94a3b8 !important;
    opacity: 1 !important;
}

[data-xtel-page] .page-calls .xtel-calls-stats-filter .xtel-filter-presets,
[data-xtel-page] .page-calls .xtel-calls-stats-filter .xtel-filter-actions {
    display: flex !important;
    flex-wrap: wrap !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 12px !important;
    width: auto !important;
    max-width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-calls-stats-filter .xtel-filter-button,
[data-xtel-page] .page-calls .xtel-calls-stats-filter button,
[data-xtel-page] .page-calls .xtel-calls-stats-filter a.xtel-filter-button {
    flex: 0 0 auto !important;
    width: auto !important;
    height: var(--xtel-control-height) !important;
    min-height: var(--xtel-control-height) !important;
    max-height: var(--xtel-control-height) !important;
    min-width: 112px !important;
    padding: 0 16px !important;
    border-radius: var(--xtel-control-radius) !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 8px !important;
    white-space: nowrap !important;
}

[data-xtel-page] .page-calls .xtel-calls-stats-filter .xtel-filter-actions .xtel-filter-button,
[data-xtel-page] .page-calls .xtel-calls-stats-filter .xtel-filter-actions button {
    min-width: var(--xtel-filter-button-width) !important;
}

[data-xtel-page] .page-calls .xtel-calls-stats-filter .xtel-filter-actions .xtel-filter-button:first-child,
[data-xtel-page] .page-calls .xtel-calls-stats-filter .xtel-filter-actions button:first-child {
    min-width: var(--xtel-filter-primary-button-width) !important;
}

/* Calls stats-copy filter row control. */
[data-xtel-page] .page-calls .xtel-calls-stats-filter .xtel-filter-row-break {
    display: block !important;
    flex: 0 0 100% !important;
    width: 100% !important;
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
}

[data-xtel-page] .page-calls .xtel-calls-stats-filter .xtel-filter-presets {
    flex: 0 0 auto !important;
}

[data-xtel-page] .page-calls .xtel-calls-stats-filter .xtel-filter-presets .xtel-filter-button,
[data-xtel-page] .page-calls .xtel-calls-stats-filter .xtel-filter-presets button.xtel-filter-button {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: 112px !important;
    max-width: none !important;
}

[data-xtel-page] .page-calls .xtel-calls-stats-filter .xtel-filter-actions {
    flex: 0 0 auto !important;
    padding-top: 0 !important;
    border-top: 0 !important;
}

[data-xtel-page] .page-calls .xtel-calls-stats-filter .xtel-filter-actions .xtel-filter-button,
[data-xtel-page] .page-calls .xtel-calls-stats-filter .xtel-filter-actions button.xtel-filter-button,
[data-xtel-page] .page-calls .xtel-calls-stats-filter .xtel-filter-actions a.xtel-filter-button {
    flex: 0 0 auto !important;
    width: auto !important;
    min-width: var(--xtel-filter-button-width) !important;
    max-width: none !important;
}

/* Calls stats-copy hard normalization over older page-specific rules. */
[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-stats-filter input.xtel-filter-control,
[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-stats-filter select.xtel-filter-control,
[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-stats-filter .xtel-filter-control,
[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-stats-filter .xtel-filter-date-pair input.xtel-filter-control {
    height: var(--xtel-control-height) !important;
    min-height: var(--xtel-control-height) !important;
    max-height: var(--xtel-control-height) !important;
    border-radius: var(--xtel-control-radius) !important;
    font-size: 15px !important;
    line-height: var(--xtel-control-height) !important;
}

[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-stats-filter .xtel-filter-button,
[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-stats-filter button.xtel-filter-button,
[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-stats-filter a.xtel-filter-button {
    height: var(--xtel-control-height) !important;
    min-height: var(--xtel-control-height) !important;
    max-height: var(--xtel-control-height) !important;
    border-radius: var(--xtel-control-radius) !important;
    font-size: 14px !important;
    line-height: 1 !important;
}

/* Calls filter exact placement from the supplied reference. */
[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter {
    --xtel-exact-date-width: 200px !important;
    --xtel-exact-time-width: 124px !important;
    --xtel-exact-field-width: 340px !important;
    --xtel-exact-status-width: 340px !important;
    --xtel-exact-col-gap: 56px !important;
    --xtel-exact-row-gap: 16px !important;
    --xtel-exact-control-height: 42px !important;
    --xtel-exact-button-height: 40px !important;
    padding: 30px 36px 28px !important;
    overflow: hidden !important;
}

[data-xtel-page] .page-calls .xtel-calls-exact-grid {
    display: grid !important;
    grid-template-columns:
        calc(var(--xtel-exact-date-width) + var(--xtel-exact-time-width) + 16px)
        var(--xtel-exact-field-width)
        var(--xtel-exact-field-width)
        var(--xtel-exact-status-width) !important;
    grid-template-rows: auto auto 54px !important;
    column-gap: var(--xtel-exact-col-gap) !important;
    row-gap: var(--xtel-exact-row-gap) !important;
    align-items: start !important;
    width: 100% !important;
    max-width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-exact-from { grid-column: 1 !important; grid-row: 1 !important; }
[data-xtel-page] .page-calls .xtel-exact-to { grid-column: 1 !important; grid-row: 2 !important; }
[data-xtel-page] .page-calls .xtel-exact-origin { grid-column: 2 !important; grid-row: 1 !important; }
[data-xtel-page] .page-calls .xtel-exact-termination-placeholder { grid-column: 2 !important; grid-row: 2 !important; }
[data-xtel-page] .page-calls .xtel-exact-source { grid-column: 3 !important; grid-row: 1 !important; }
[data-xtel-page] .page-calls .xtel-exact-destination { grid-column: 3 !important; grid-row: 2 !important; }
[data-xtel-page] .page-calls .xtel-exact-status { grid-column: 4 !important; grid-row: 1 !important; }
[data-xtel-page] .page-calls .xtel-exact-presets { grid-column: 1 / 3 !important; grid-row: 3 !important; align-self: end !important; }
[data-xtel-page] .page-calls .xtel-exact-actions { grid-column: 4 !important; grid-row: 3 !important; align-self: end !important; justify-self: end !important; }

[data-xtel-page] .page-calls .xtel-calls-exact-filter .xtel-filter-field {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    flex: none !important;
}

[data-xtel-page] .page-calls .xtel-calls-exact-filter label {
    display: block !important;
    margin: 0 0 8px !important;
    color: var(--xtel-muted) !important;
    font-size: 22px !important;
    font-weight: 500 !important;
    line-height: 1.05 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}

[data-xtel-page] .page-calls .xtel-calls-exact-filter .xtel-filter-date-pair {
    display: grid !important;
    grid-template-columns: var(--xtel-exact-date-width) var(--xtel-exact-time-width) !important;
    gap: 16px !important;
    width: 100% !important;
    max-width: 100% !important;
}

[data-xtel-page] .page-calls .xtel-calls-exact-filter input.xtel-filter-control,
[data-xtel-page] .page-calls .xtel-calls-exact-filter select.xtel-filter-control,
[data-xtel-page] .page-calls .xtel-calls-exact-filter .xtel-filter-control {
    width: 100% !important;
    height: var(--xtel-exact-control-height) !important;
    min-height: var(--xtel-exact-control-height) !important;
    max-height: var(--xtel-exact-control-height) !important;
    padding: 0 14px !important;
    border-radius: 0 !important;
    border: 1px solid #3b4048 !important;
    background: var(--xtel-surface-soft) !important;
    color: var(--xtel-text) !important;
    font-size: 18px !important;
    font-weight: 400 !important;
    line-height: var(--xtel-exact-control-height) !important;
    box-shadow: none !important;
}

[data-xtel-page] .page-calls .xtel-calls-exact-filter input::placeholder {
    color: #94a3b8 !important;
    opacity: 1 !important;
}

[data-xtel-page] .page-calls .xtel-calls-exact-filter .xtel-filter-presets,
[data-xtel-page] .page-calls .xtel-calls-exact-filter .xtel-filter-actions {
    display: flex !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
    gap: 6px !important;
    width: auto !important;
    max-width: 100% !important;
    padding: 0 !important;
    border: 0 !important;
}

[data-xtel-page] .page-calls .xtel-calls-exact-filter .xtel-filter-presets {
    justify-content: flex-start !important;
}

[data-xtel-page] .page-calls .xtel-calls-exact-filter .xtel-filter-actions {
    gap: 16px !important;
    justify-content: flex-end !important;
}

[data-xtel-page] .page-calls .xtel-calls-exact-filter .xtel-filter-button,
[data-xtel-page] .page-calls .xtel-calls-exact-filter button.xtel-filter-button {
    flex: 0 0 auto !important;
    width: auto !important;
    height: var(--xtel-exact-button-height) !important;
    min-height: var(--xtel-exact-button-height) !important;
    max-height: var(--xtel-exact-button-height) !important;
    min-width: 0 !important;
    padding: 0 12px !important;
    border-radius: 0 !important;
    font-size: 18px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}

[data-xtel-page] .page-calls .xtel-calls-exact-filter .xtel-filter-actions .xtel-filter-button {
    width: 132px !important;
    min-width: 132px !important;
    max-width: 132px !important;
}

[data-xtel-page] .page-calls .xtel-calls-exact-filter .xtel-filter-button-primary {
    width: 132px !important;
    min-width: 132px !important;
    max-width: 132px !important;
}

[data-xtel-page] .page-calls .xtel-calls-exact-filter .xtel-filter-presets .xtel-filter-button,
[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-presets button.xtel-filter-button {
    width: auto !important;
    min-width: 0 !important;
    max-width: none !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
}

[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-actions .xtel-filter-button,
[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-actions button.xtel-filter-button {
    width: 132px !important;
    min-width: 132px !important;
    max-width: 132px !important;
}

@media (max-width: 1700px) {
    [data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter {
        --xtel-exact-date-width: 200px !important;
        --xtel-exact-time-width: 124px !important;
        --xtel-exact-field-width: 340px !important;
        --xtel-exact-status-width: 340px !important;
        --xtel-exact-col-gap: 40px !important;
    }
}

/* Calls exact placement with stats visual styling. Keep this block last. */
[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter {
    --xtel-exact-date-width: var(--xtel-filter-date-width) !important;
    --xtel-exact-time-width: var(--xtel-filter-time-width) !important;
    --xtel-exact-field-width: var(--xtel-filter-field-width) !important;
    --xtel-exact-status-width: var(--xtel-filter-field-width) !important;
    --xtel-exact-col-gap: 56px !important;
    --xtel-exact-control-height: var(--xtel-control-height) !important;
    --xtel-exact-button-height: var(--xtel-control-height) !important;
    padding: 24px !important;
    background: var(--xtel-surface) !important;
    border-color: var(--xtel-border) !important;
    border-radius: 12px !important;
}

[data-xtel-page] .page-calls .xtel-calls-exact-grid {
    grid-template-columns:
        calc(var(--xtel-exact-date-width) + var(--xtel-exact-time-width) + 8px)
        var(--xtel-exact-field-width)
        var(--xtel-exact-field-width)
        var(--xtel-exact-status-width) !important;
    grid-template-rows: auto auto 40px !important;
    column-gap: var(--xtel-exact-col-gap) !important;
    row-gap: 16px !important;
}

[data-xtel-page] .page-calls .xtel-calls-exact-filter .xtel-filter-date-pair {
    grid-template-columns: var(--xtel-exact-date-width) var(--xtel-exact-time-width) !important;
    gap: 8px !important;
}

[data-xtel-page] .page-calls .xtel-calls-exact-filter label {
    margin: 0 0 7px !important;
    color: var(--xtel-text) !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}

[data-xtel-page] .page-calls .xtel-calls-exact-filter input.xtel-filter-control,
[data-xtel-page] .page-calls .xtel-calls-exact-filter select.xtel-filter-control,
[data-xtel-page] .page-calls .xtel-calls-exact-filter .xtel-filter-control {
    height: var(--xtel-control-height) !important;
    min-height: var(--xtel-control-height) !important;
    max-height: var(--xtel-control-height) !important;
    padding: 0 14px !important;
    border-radius: var(--xtel-control-radius) !important;
    border: 1px solid #3b4048 !important;
    background: var(--xtel-surface-soft) !important;
    color: var(--xtel-text) !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    line-height: var(--xtel-control-height) !important;
    box-shadow: none !important;
}

[data-xtel-page] .page-calls .xtel-calls-exact-filter .xtel-filter-button,
[data-xtel-page] .page-calls .xtel-calls-exact-filter button.xtel-filter-button {
    height: var(--xtel-control-height) !important;
    min-height: var(--xtel-control-height) !important;
    max-height: var(--xtel-control-height) !important;
    padding: 0 16px !important;
    border-radius: var(--xtel-control-radius) !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}

[data-xtel-page] .page-calls .xtel-calls-exact-filter .xtel-filter-presets {
    gap: 6px !important;
}

[data-xtel-page] .page-calls .xtel-calls-exact-filter .xtel-filter-actions {
    gap: 16px !important;
}

[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-actions .xtel-filter-button,
[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-actions button.xtel-filter-button {
    width: var(--xtel-filter-button-width) !important;
    min-width: var(--xtel-filter-button-width) !important;
    max-width: var(--xtel-filter-button-width) !important;
}

[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-actions .xtel-filter-button-primary {
    width: var(--xtel-filter-primary-button-width) !important;
    min-width: var(--xtel-filter-primary-button-width) !important;
    max-width: var(--xtel-filter-primary-button-width) !important;
}

/* Calls exact filter final container-fit override. Must remain last. */
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter {
    --xtel-exact-date-width: 188px !important;
    --xtel-exact-time-width: 104px !important;
    --xtel-exact-pair-width: 300px !important;
    --xtel-exact-field-width: 304px !important;
    --xtel-exact-status-width: 304px !important;
    --xtel-exact-control-height: 40px !important;
    --xtel-exact-button-height: 40px !important;
    padding: 24px 34px 28px !important;
    overflow: hidden !important;
}

body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-calls-exact-grid {
    display: grid !important;
    grid-template-columns: var(--xtel-exact-pair-width) var(--xtel-exact-field-width) var(--xtel-exact-field-width) var(--xtel-exact-status-width) !important;
    grid-template-rows: auto auto 40px !important;
    justify-content: space-between !important;
    align-items: start !important;
    column-gap: 0 !important;
    row-gap: 16px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
}

body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-field,
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-field-select,
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-field-text {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: none !important;
}

body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-date-pair {
    display: grid !important;
    grid-template-columns: var(--xtel-exact-date-width) var(--xtel-exact-time-width) !important;
    gap: 8px !important;
    width: var(--xtel-exact-pair-width) !important;
    max-width: var(--xtel-exact-pair-width) !important;
}

body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter label {
    margin: 0 0 7px !important;
    color: var(--xtel-text) !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}

body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter input.xtel-filter-control,
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter select.xtel-filter-control,
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-control {
    width: 100% !important;
    height: var(--xtel-exact-control-height) !important;
    min-height: var(--xtel-exact-control-height) !important;
    max-height: var(--xtel-exact-control-height) !important;
    padding: 0 14px !important;
    border-radius: var(--xtel-control-radius) !important;
    border: 1px solid #3b4048 !important;
    background: var(--xtel-surface-soft) !important;
    color: var(--xtel-text) !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    line-height: var(--xtel-exact-control-height) !important;
    box-shadow: none !important;
}

body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-exact-from { grid-column: 1 !important; grid-row: 1 !important; }
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-exact-to { grid-column: 1 !important; grid-row: 2 !important; }
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-exact-origin { grid-column: 2 !important; grid-row: 1 !important; }
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-exact-source { grid-column: 3 !important; grid-row: 1 !important; }
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-exact-destination { grid-column: 3 !important; grid-row: 2 !important; }
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-exact-status { grid-column: 4 !important; grid-row: 1 !important; }
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-exact-presets { grid-column: 1 / 3 !important; grid-row: 3 !important; align-self: end !important; justify-self: start !important; }
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-exact-actions { grid-column: 4 !important; grid-row: 3 !important; align-self: end !important; justify-self: end !important; }

body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-presets,
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-actions {
    display: flex !important;
    flex-wrap: nowrap !important;
    width: auto !important;
    max-width: 100% !important;
    padding: 0 !important;
    border: 0 !important;
}

body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-presets {
    gap: 6px !important;
}

body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-actions {
    gap: 16px !important;
}

body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-button,
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter button.xtel-filter-button {
    flex: 0 0 auto !important;
    width: auto !important;
    height: var(--xtel-exact-button-height) !important;
    min-height: var(--xtel-exact-button-height) !important;
    max-height: var(--xtel-exact-button-height) !important;
    min-width: 0 !important;
    padding: 0 10px !important;
    border-radius: var(--xtel-control-radius) !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1 !important;
}

body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-actions .xtel-filter-button,
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-actions button.xtel-filter-button {
    width: 128px !important;
    min-width: 128px !important;
    max-width: 128px !important;
    padding-left: 16px !important;
    padding-right: 16px !important;
}

body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-actions .xtel-filter-button-primary,
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-actions button.xtel-filter-button-primary {
    width: 150px !important;
    min-width: 150px !important;
    max-width: 150px !important;
}

/* Calls filter final 3-column / 2-row structure. Must remain last. */
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter {
    --xtel-call-col-1: 300px !important;
    --xtel-call-col: 304px !important;
    --xtel-call-control-height: 40px !important;
    padding: 24px 34px 28px !important;
    overflow: hidden !important;
}

body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-calls-exact-grid {
    display: grid !important;
    grid-template-columns: var(--xtel-call-col-1) var(--xtel-call-col) var(--xtel-call-col) !important;
    grid-template-rows: auto auto 40px !important;
    justify-content: space-between !important;
    align-items: start !important;
    column-gap: 0 !important;
    row-gap: 16px !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
}

body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-exact-from { grid-column: 1 !important; grid-row: 1 !important; }
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-exact-to { grid-column: 1 !important; grid-row: 2 !important; }
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-exact-origin { grid-column: 2 !important; grid-row: 1 !important; }
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-exact-status { grid-column: 2 !important; grid-row: 2 !important; }
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-exact-source { grid-column: 3 !important; grid-row: 1 !important; }
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-exact-destination { grid-column: 3 !important; grid-row: 2 !important; }
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-exact-presets { grid-column: 1 / 3 !important; grid-row: 3 !important; align-self: end !important; justify-self: start !important; }
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-exact-actions { grid-column: 3 !important; grid-row: 3 !important; align-self: end !important; justify-self: end !important; }

body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-date-pair {
    display: grid !important;
    grid-template-columns: 188px 104px !important;
    gap: 8px !important;
    width: var(--xtel-call-col-1) !important;
    max-width: var(--xtel-call-col-1) !important;
}

body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-field,
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-field-select,
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-field-text {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    flex: none !important;
}

body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter input.xtel-filter-control,
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter select.xtel-filter-control,
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-control {
    width: 100% !important;
    height: var(--xtel-call-control-height) !important;
    min-height: var(--xtel-call-control-height) !important;
    max-height: var(--xtel-call-control-height) !important;
    padding: 0 14px !important;
    border-radius: var(--xtel-control-radius) !important;
    border: 1px solid #3b4048 !important;
    background: var(--xtel-surface-soft) !important;
    color: var(--xtel-text) !important;
    font-size: 15px !important;
    font-weight: 400 !important;
    line-height: var(--xtel-call-control-height) !important;
    box-shadow: none !important;
}

body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter label {
    margin: 0 0 7px !important;
    color: var(--xtel-text) !important;
    font-size: 14px !important;
    font-weight: 700 !important;
    line-height: 1.25 !important;
    text-transform: none !important;
    letter-spacing: 0 !important;
}

/* Calls filter CDR action restored before Clear. */
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-exact-actions {
    grid-column: 3 !important;
    justify-self: end !important;
}

body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-actions {
    gap: 12px !important;
}

body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-actions .xtel-filter-button,
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-actions button.xtel-filter-button,
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-actions a.xtel-filter-button {
    width: 112px !important;
    min-width: 112px !important;
    max-width: 112px !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
}

body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-actions .xtel-filter-button-primary,
body[data-xtel-page] .page-calls .xtel-filter-card.xtel-calls-exact-filter .xtel-filter-actions button.xtel-filter-button-primary {
    width: 128px !important;
    min-width: 128px !important;
    max-width: 128px !important;
}

/* Destination groups table: softer dark surface and text contrast. */
body[data-xtel-page] .xtel-destination-groups-widget .xtel-data-table thead,
body[data-xtel-page] .xtel-destination-groups-widget .xtel-data-table thead tr,
body[data-xtel-page] .xtel-destination-groups-widget .xtel-data-table thead th {
    background: #131820 !important;
    color: #d7dde6 !important;
    border-color: #303846 !important;
}

body[data-xtel-page] .xtel-destination-groups-widget .xtel-data-table tbody tr:nth-child(odd),
body[data-xtel-page] .xtel-destination-groups-widget .xtel-data-table tbody tr:nth-child(odd) td {
    background: #050607 !important;
}

body[data-xtel-page] .xtel-destination-groups-widget .xtel-data-table tbody tr:nth-child(even),
body[data-xtel-page] .xtel-destination-groups-widget .xtel-data-table tbody tr:nth-child(even) td {
    background: #101214 !important;
}

body[data-xtel-page] .xtel-destination-groups-widget .xtel-data-table tbody td,
body[data-xtel-page] .xtel-destination-groups-widget .xtel-data-table tbody td * {
    color: #d6dbe3 !important;
}

body[data-xtel-page] .xtel-destination-groups-widget .xtel-data-table-scroll {
    background: #050607 !important;
}

body[data-xtel-page] .xtel-destination-groups-widget .mor-destination-groups-total-row,
body[data-xtel-page] .xtel-destination-groups-widget .mor-destination-groups-total-row tr,
body[data-xtel-page] .xtel-destination-groups-widget .mor-destination-groups-total-row td {
    background: #060708 !important;
    color: #e1e6ee !important;
    border-color: #8b929c !important;
}

body[data-xtel-page] .xtel-destination-groups-widget .mor-destination-groups-total-row td * {
    color: #e1e6ee !important;
}

body[data-xtel-page] .xtel-destination-groups-widget h3 {
    color: #edf1f6 !important;
}

body[data-xtel-page] .xtel-destination-groups-widget p,
body[data-xtel-page] .xtel-destination-groups-widget .text-gray-500 {
    color: #bac3cf !important;
}

/* Calls List and Origination Points tables: match softened stats table contrast. */
body[data-xtel-page] .xtel-calls-list-table thead,
body[data-xtel-page] .xtel-calls-list-table thead tr,
body[data-xtel-page] .xtel-calls-list-table thead th,
body[data-xtel-page] .xtel-origination-points-table thead,
body[data-xtel-page] .xtel-origination-points-table thead tr,
body[data-xtel-page] .xtel-origination-points-table thead th {
    background: #131820 !important;
    color: #d7dde6 !important;
    border-color: #303846 !important;
}

body[data-xtel-page] .xtel-calls-list-table tbody tr:nth-child(odd),
body[data-xtel-page] .xtel-calls-list-table tbody tr:nth-child(odd) td,
body[data-xtel-page] .xtel-origination-points-table tbody tr:nth-child(odd),
body[data-xtel-page] .xtel-origination-points-table tbody tr:nth-child(odd) td {
    background: #050607 !important;
}

body[data-xtel-page] .xtel-calls-list-table tbody tr:nth-child(even),
body[data-xtel-page] .xtel-calls-list-table tbody tr:nth-child(even) td,
body[data-xtel-page] .xtel-origination-points-table tbody tr:nth-child(even),
body[data-xtel-page] .xtel-origination-points-table tbody tr:nth-child(even) td {
    background: #101214 !important;
}

body[data-xtel-page] .xtel-calls-list-table tbody tr:hover,
body[data-xtel-page] .xtel-calls-list-table tbody tr:hover td,
body[data-xtel-page] .xtel-origination-points-table tbody tr:hover,
body[data-xtel-page] .xtel-origination-points-table tbody tr:hover td {
    background: #161a20 !important;
}

body[data-xtel-page] .xtel-calls-list-table tbody td,
body[data-xtel-page] .xtel-calls-list-table tbody td *,
body[data-xtel-page] .xtel-origination-points-table tbody td,
body[data-xtel-page] .xtel-origination-points-table tbody td * {
    color: #d6dbe3 !important;
}

body[data-xtel-page] .xtel-calls-list-table tfoot,
body[data-xtel-page] .xtel-calls-list-table tfoot tr,
body[data-xtel-page] .xtel-calls-list-table tfoot td {
    background: #060708 !important;
    color: #e1e6ee !important;
    border-color: #8b929c !important;
}

body[data-xtel-page] .xtel-calls-list-table tfoot td * {
    color: #e1e6ee !important;
}

/* Utility totals and pagination: muted blue accent text. */
body[data-xtel-page] .xtel-destination-groups-widget .mor-destination-groups-total-row td,
body[data-xtel-page] .xtel-destination-groups-widget .mor-destination-groups-total-row td *,
body[data-xtel-page] .xtel-calls-list-table tfoot td,
body[data-xtel-page] .xtel-calls-list-table tfoot td * {
    color: #9eb8df !important;
}

body[data-xtel-page] .xtel-data-table-pagination,
body[data-xtel-page] .xtel-data-table-pagination *,
body[data-xtel-page] .page-calls .px-8.pb-12,
body[data-xtel-page] .page-calls .px-8.pb-12 *,
body[data-xtel-page] .page-trunks .xtel-trunks-primary-pagination,
body[data-xtel-page] .page-trunks .xtel-trunks-primary-pagination * {
    color: #91acd5 !important;
}

body[data-xtel-page] .xtel-data-table-pagination button,
body[data-xtel-page] .page-calls .px-8.pb-12 button,
body[data-xtel-page] .page-trunks .xtel-trunks-primary-pagination button {
    border-color: #344763 !important;
    background: #101722 !important;
    color: #9eb8df !important;
}

body[data-xtel-page] .xtel-data-table-pagination button:hover,
body[data-xtel-page] .page-calls .px-8.pb-12 button:hover,
body[data-xtel-page] .page-trunks .xtel-trunks-primary-pagination button:hover {
    background: #142033 !important;
    color: #c1d4ef !important;
}

/* Calls List status colors. */
body[data-xtel-page] .xtel-calls-list-table .xtel-call-status {
    font-weight: 700 !important;
    letter-spacing: 0.01em !important;
}

body[data-xtel-page] .xtel-calls-list-table .xtel-call-status-busy {
    color: #f3c74f !important;
}

body[data-xtel-page] .xtel-calls-list-table .xtel-call-status-failed {
    color: #ff6b6b !important;
}

body[data-xtel-page] .xtel-calls-list-table .xtel-call-status-answered {
    color: #65d383 !important;
}

body[data-xtel-page] .xtel-calls-list-table .xtel-call-status-no-answer {
    color: #d6dbe3 !important;
}