/**
 * Azur Floating Contact — Frontend Runtime
 *
 * Table of Contents
 * 1. Foundation and variables
 * 2. Positioning and panel layout
 * 3. Launcher and channels
 * 4. Presets and responsive behavior
 * 5. Motion and attention effects
 * 6. Agents and departments
 * 7. Accessibility, RTL, and print
 */
/* Foundation and visibility */

.azur-contact-hub[data-device-pending="1"],.azur-contact-hub.is-device-hidden {
    display: none !important;
}

.azur-contact-hub {
    --ach-edge: 24px;
    --ach-gap: 10px;
    --ach-button-color: #1f6f5f;
    --ach-button-text: #fff;
    --ach-button-hover: #18584c;
    --ach-button-hover-text: #fff;
    --ach-button-border: #1f6f5f;
    --ach-panel-bg: #fff;
    --ach-panel-text: #0f172a;
    --ach-panel-border: #e2e8f0;
    --ach-channel-text: #fff;
    --ach-header-bg: #f8fafc;
    --ach-header-text: #0f172a;
    --ach-badge-color: #ef4444;
    --ach-button-size: 58px;
    --ach-button-padding-x: 16px;
    --ach-button-border-width: 0;
    --ach-icon-size: 24px;
    --ach-max-width: 320px;
    --ach-panel-padding: 10px;
    --ach-panel-border-width: 1px;
    --ach-panel-blur: 0;
    --ach-panel-max-height: 520px;
    --ach-panel-radius: 14px;
    --ach-channel-radius: 10px;
    --ach-channel-height: 46px;
    --ach-channel-padding-x: 12px;
    --ach-channel-hover-lift: 1px;
    --ach-label-font-size: 14px;
    --ach-label-font-weight: 600;
    --ach-button-radius: 999px;
    --ach-mobile-button-size: 54px;
    --ach-mobile-panel-width: 300px;
    --ach-mobile-icon-size: 22px;
    --ach-z-index: 999999;
    --ach-effective-edge: var(--ach-edge);
    --ach-effective-button-size: var(--ach-button-size);
    --ach-effective-icon-size: var(--ach-icon-size);
    --ach-effective-max-width: var(--ach-max-width);
    z-index: var(--ach-z-index);
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: var(--ach-gap);
    font-family: inherit;
    line-height: 1.35;
}

.azur-contact-hub--floating {
    position: fixed;
}

.azur-contact-hub--inline {
    position: relative;
    display: inline-flex;
}

.azur-contact-hub--bottom-right {
    right: calc(var(--ach-effective-edge) + env(safe-area-inset-right));
    bottom: calc(var(--ach-effective-edge) + env(safe-area-inset-bottom));
}

.azur-contact-hub--bottom-left {
    left: calc(var(--ach-effective-edge) + env(safe-area-inset-left));
    bottom: calc(var(--ach-effective-edge) + env(safe-area-inset-bottom));
    align-items: flex-start;
}

.azur-contact-hub--middle-right {
    right: calc(var(--ach-effective-edge) + env(safe-area-inset-right));
    top: 50%;
    transform: translateY(-50%);
}

.azur-contact-hub--middle-left {
    left: calc(var(--ach-effective-edge) + env(safe-area-inset-left));
    top: 50%;
    transform: translateY(-50%);
    align-items: flex-start;
}

.azur-contact-hub--top-right {
    right: calc(var(--ach-effective-edge) + env(safe-area-inset-right));
    top: calc(var(--ach-effective-edge) + env(safe-area-inset-top));
}

.azur-contact-hub--top-left {
    left: calc(var(--ach-effective-edge) + env(safe-area-inset-left));
    top: calc(var(--ach-effective-edge) + env(safe-area-inset-top));
    align-items: flex-start;
}

/* Contact panel */

.azur-contact-hub__panel {
    display: flex;
    flex-direction: column;
    gap: var(--ach-gap);
    width: min(var(--ach-effective-max-width),calc(100vw - 32px));
    max-height: min(var(--ach-panel-max-height),calc(100vh - 110px));
    max-height: min(var(--ach-panel-max-height),calc(100dvh - 110px));
    overflow: auto;
    padding: var(--ach-panel-padding);
    background: var(--ach-panel-bg);
    color: var(--ach-panel-text);
    border: var(--ach-panel-border-width) solid var(--ach-panel-border);
    border-radius: var(--ach-panel-radius);
    box-shadow: 0 18px 55px rgba(15,23,42,.2);
    backdrop-filter: blur(var(--ach-panel-blur));
    -webkit-backdrop-filter: blur(var(--ach-panel-blur));
    transform-origin: bottom right;
    scrollbar-width: thin;
}

.azur-contact-hub__panel[hidden] {
    display: none;
}

.azur-contact-hub__header {
    display: flex;
    flex-direction: column;
    gap: 3px;
    margin: calc(var(--ach-panel-padding)*-1) calc(var(--ach-panel-padding)*-1) 2px;
    padding: 14px 16px;
    background: var(--ach-header-bg);
    color: var(--ach-header-text);
    border-radius: calc(var(--ach-panel-radius) - 1px) calc(var(--ach-panel-radius) - 1px) 0 0;
}

.azur-contact-hub__header strong {
    font-size: 15px;
    line-height: 1.3;
}

.azur-contact-hub__header span {
    font-size: 12px;
    opacity: .78;
}

/* Contact channels */

.azur-contact-hub__channel {
    display: flex;
    align-items: center;
    gap: 10px;
    min-height: var(--ach-channel-height);
    padding: 8px var(--ach-channel-padding-x);
    border-radius: var(--ach-channel-radius);
    background: var(--ach-channel-color,#334155);
    color: var(--ach-channel-text);
    text-decoration: none;
    transition: transform .18s ease,filter .18s ease,box-shadow .18s ease;
}

.azur-contact-hub__channel:hover,.azur-contact-hub__channel:focus-visible {
    color: var(--ach-channel-text);
    filter: brightness(1.06);
    transform: translateY(calc(var(--ach-channel-hover-lift)*-1));
    box-shadow: 0 8px 22px rgba(15,23,42,.16);
}

.azur-contact-hub__channel-icon,.azur-contact-hub__channel-icon svg {
    display: block;
    width: var(--ach-effective-icon-size);
    height: var(--ach-effective-icon-size);
    flex: 0 0 var(--ach-effective-icon-size);
}

.azur-contact-hub__channel-label {
    font-size: var(--ach-label-font-size);
    font-weight: var(--ach-label-font-weight);
    overflow-wrap: anywhere;
}

/* Launcher */

.azur-contact-hub__toggle {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-width: var(--ach-effective-button-size);
    height: var(--ach-effective-button-size);
    padding: 0 var(--ach-button-padding-x);
    border: var(--ach-button-border-width) solid var(--ach-button-border);
    border-radius: var(--ach-button-radius);
    background: var(--ach-button-color);
    color: var(--ach-button-text);
    box-shadow: 0 12px 34px rgba(15,23,42,.25);
    cursor: pointer;
    font: inherit;
    font-weight: 700;
    transition: background .18s ease,color .18s ease,transform .18s ease;
}

.azur-contact-hub__toggle:hover,.azur-contact-hub__toggle:focus-visible {
    background: var(--ach-button-hover);
    color: var(--ach-button-hover-text);
    transform: translateY(-1px);
}

.azur-contact-hub__toggle-icon,.azur-contact-hub__toggle-icon svg {
    display: block;
    width: var(--ach-effective-icon-size);
    height: var(--ach-effective-icon-size);
}

.azur-contact-hub__toggle:focus-visible {
    outline: 3px solid rgba(59,130,246,.45);
    outline-offset: 3px;
}

.azur-contact-hub__badge {
    position: absolute;
    right: -5px;
    top: -5px;
    display: grid;
    place-items: center;
    min-width: 20px;
    height: 20px;
    padding: 0 5px;
    border: 2px solid #fff;
    border-radius: 999px;
    background: var(--ach-badge-color);
    color: #fff;
    font-size: 10px;
    line-height: 1;
}

.azur-contact-hub--launcher-icon .azur-contact-hub__toggle {
    width: var(--ach-effective-button-size);
    padding: 0;
}

.azur-contact-hub--launcher-text .azur-contact-hub__toggle {
    min-width: auto;
}

.azur-contact-hub--inline .azur-contact-hub__panel {
    position: absolute;
    bottom: calc(100% + var(--ach-gap));
    right: 0;
}

.azur-contact-hub--inline.azur-contact-hub--bottom-left .azur-contact-hub__panel,.azur-contact-hub--inline.azur-contact-hub--top-left .azur-contact-hub__panel {
    right: auto;
    left: 0;
}

.azur-contact-hub--open-down {
    flex-direction: column-reverse;
}

.azur-contact-hub--open-left {
    flex-direction: row;
    align-items: flex-end;
}

.azur-contact-hub--open-right {
    flex-direction: row-reverse;
    align-items: flex-end;
}

.azur-contact-hub--layout-dock .azur-contact-hub__panel {
    flex-direction: row;
    flex-wrap: wrap;
    width: auto;
    max-width: min(var(--ach-effective-max-width),calc(100vw - 32px));
}

.azur-contact-hub--layout-dock .azur-contact-hub__header {
    flex-basis: 100%;
    width: 100%;
}

.azur-contact-hub--layout-dock .azur-contact-hub__channel,.azur-contact-hub--layout-compact .azur-contact-hub__channel {
    justify-content: center;
    min-width: var(--ach-channel-height);
    padding: 8px;
}

.azur-contact-hub--layout-compact .azur-contact-hub__panel {
    width: auto;
}

.azur-contact-hub--layout-dock .azur-contact-hub__channel-label,.azur-contact-hub--layout-compact .azur-contact-hub__channel-label,.azur-contact-hub--labels-hidden .azur-contact-hub__channel-label {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border: 0;
}

/* Visual presets */

.azur-contact-hub--preset-minimal .azur-contact-hub__panel {
    border-color: transparent;
    box-shadow: none;
    padding: 4px;
    background: transparent;
    backdrop-filter: none;
}

.azur-contact-hub--preset-minimal .azur-contact-hub__header {
    margin: 0 0 4px;
    border-radius: var(--ach-panel-radius);
}

.azur-contact-hub--preset-minimal .azur-contact-hub__channel {
    box-shadow: 0 4px 14px rgba(15,23,42,.12);
}

.azur-contact-hub--preset-glass .azur-contact-hub__panel {
    border-color: rgba(255,255,255,.42);
}

.azur-contact-hub--preset-dark .azur-contact-hub__panel {
    --ach-panel-bg: rgba(17,24,39,.96);
    --ach-panel-text: #fff;
    --ach-panel-border: rgba(255,255,255,.12);
}

.azur-contact-hub--preset-square .azur-contact-hub__panel,.azur-contact-hub--preset-square .azur-contact-hub__channel,.azur-contact-hub--preset-square .azur-contact-hub__toggle {
    border-radius: 2px;
}

.azur-contact-hub--shadow-none .azur-contact-hub__panel,.azur-contact-hub--shadow-none .azur-contact-hub__toggle {
    box-shadow: none;
}

.azur-contact-hub--shadow-strong .azur-contact-hub__panel {
    box-shadow: 0 26px 80px rgba(15,23,42,.34);
}

.azur-contact-hub--shadow-strong .azur-contact-hub__toggle {
    box-shadow: 0 18px 48px rgba(15,23,42,.36);
}

/* Motion and attention */

.azur-contact-hub--pulse .azur-contact-hub__toggle:before {
    content: "";
    position: absolute;
    inset: -8px;
    border: 2px solid var(--ach-button-color);
    border-radius: inherit;
    animation: achPulse 2s ease-out infinite;
    pointer-events: none;
}

.azur-contact-hub.is-open.azur-contact-hub--animation-fade .azur-contact-hub__panel {
    animation: achFade .22s ease both;
}

.azur-contact-hub.is-open.azur-contact-hub--animation-fade-up .azur-contact-hub__panel {
    animation: achFadeUp .24s ease both;
}

.azur-contact-hub.is-open.azur-contact-hub--animation-scale .azur-contact-hub__panel {
    animation: achScale .2s ease both;
}

.azur-contact-hub.is-open.azur-contact-hub--animation-slide .azur-contact-hub__panel {
    animation: achSlide .24s ease both;
}

@keyframes achFade {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }

}

@keyframes achFadeUp {
    from {
        opacity: 0;
        transform: translateY(10px);
    }

    to {
        opacity: 1;
        transform: none;
    }

}

@keyframes achScale {
    from {
        opacity: 0;
        transform: scale(.94);
    }

    to {
        opacity: 1;
        transform: none;
    }

}

@keyframes achSlide {
    from {
        opacity: 0;
        transform: translateX(12px);
    }

    to {
        opacity: 1;
        transform: none;
    }

}

@keyframes achPulse {
    0% {
        opacity: .55;
        transform: scale(.82);
    }

    75%,100% {
        opacity: 0;
        transform: scale(1.18);
    }

}

@media (max-width:767px) {
    .azur-contact-hub {
        --ach-effective-edge: 16px;
        --ach-effective-button-size: var(--ach-mobile-button-size);
        --ach-effective-icon-size: var(--ach-mobile-icon-size);
        --ach-effective-max-width: var(--ach-mobile-panel-width);
    }

    .azur-contact-hub--mobile-bottom-right {
        right: calc(var(--ach-effective-edge) + env(safe-area-inset-right));
        left: auto;
        top: auto;
        bottom: calc(var(--ach-effective-edge) + env(safe-area-inset-bottom));
        transform: none;
        align-items: flex-end;
    }

    .azur-contact-hub--mobile-bottom-left {
        left: calc(var(--ach-effective-edge) + env(safe-area-inset-left));
        right: auto;
        top: auto;
        bottom: calc(var(--ach-effective-edge) + env(safe-area-inset-bottom));
        transform: none;
        align-items: flex-start;
    }

    .azur-contact-hub--mobile-middle-right {
        right: calc(var(--ach-effective-edge) + env(safe-area-inset-right));
        left: auto;
        top: 50%;
        bottom: auto;
        transform: translateY(-50%);
        align-items: flex-end;
    }

    .azur-contact-hub--mobile-middle-left {
        left: calc(var(--ach-effective-edge) + env(safe-area-inset-left));
        right: auto;
        top: 50%;
        bottom: auto;
        transform: translateY(-50%);
        align-items: flex-start;
    }

    .azur-contact-hub--mobile-top-right {
        right: calc(var(--ach-effective-edge) + env(safe-area-inset-right));
        left: auto;
        top: calc(var(--ach-effective-edge) + env(safe-area-inset-top));
        bottom: auto;
        transform: none;
        align-items: flex-end;
    }

    .azur-contact-hub--mobile-top-left {
        left: calc(var(--ach-effective-edge) + env(safe-area-inset-left));
        right: auto;
        top: calc(var(--ach-effective-edge) + env(safe-area-inset-top));
        bottom: auto;
        transform: none;
        align-items: flex-start;
    }

    .azur-contact-hub--mobile-labels-hidden .azur-contact-hub__channel-label {
        position: absolute;
        width: 1px;
        height: 1px;
        padding: 0;
        margin: -1px;
        overflow: hidden;
        clip: rect(0,0,0,0);
        white-space: nowrap;
        border: 0;
    }

    .azur-contact-hub--mobile-labels-hidden .azur-contact-hub__channel {
        justify-content: center;
        min-width: var(--ach-channel-height);
        padding-left: 8px;
        padding-right: 8px;
    }

    .azur-contact-hub--launcher-icon-text .azur-contact-hub__toggle-label {
        display: none;
    }

}

@media (prefers-reduced-motion:reduce) {
    .azur-contact-hub__channel,.azur-contact-hub__toggle {
        transition: none;
    }

    .azur-contact-hub__panel,.azur-contact-hub__toggle:before {
        animation: none !important;
    }

}

.azur-contact-hub {
    --ach-online-color: #22c55e;
}

.azur-contact-hub__toggle-icon--close {
    display: none;
}

.azur-contact-hub.is-open .azur-contact-hub__toggle-icon--open {
    display: none;
}

.azur-contact-hub.is-open .azur-contact-hub__toggle-icon--close {
    display: block;
}

.azur-contact-hub__online-dot,.azur-contact-hub__notification-dot {
    position: absolute;
    display: block;
    width: 11px;
    height: 11px;
    border: 2px solid #fff;
    border-radius: 999px;
    pointer-events: none;
}

.azur-contact-hub__online-dot {
    left: -2px;
    bottom: 2px;
    background: var(--ach-online-color);
}

.azur-contact-hub__notification-dot {
    right: 2px;
    top: 2px;
    background: var(--ach-badge-color);
}

.azur-contact-hub__tooltip {
    position: absolute;
    z-index: 2;
    max-width: 220px;
    padding: 7px 10px;
    border-radius: 7px;
    background: #0f172a;
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    line-height: 1.25;
    white-space: nowrap;
    opacity: 0;
    visibility: hidden;
    transform: translateY(2px);
    transition: opacity .16s ease,transform .16s ease,visibility .16s ease;
    pointer-events: none;
    box-shadow: 0 8px 24px rgba(15,23,42,.22);
}

.azur-contact-hub__toggle:hover .azur-contact-hub__tooltip,.azur-contact-hub__toggle:focus-visible .azur-contact-hub__tooltip {
    opacity: 1;
    visibility: visible;
    transform: none;
}

.azur-contact-hub--tooltip-left .azur-contact-hub__tooltip {
    right: calc(100% + 10px);
    top: 50%;
    transform: translateY(-48%);
}

.azur-contact-hub--tooltip-left .azur-contact-hub__toggle:hover .azur-contact-hub__tooltip,.azur-contact-hub--tooltip-left .azur-contact-hub__toggle:focus-visible .azur-contact-hub__tooltip {
    transform: translateY(-50%);
}

.azur-contact-hub--tooltip-right .azur-contact-hub__tooltip {
    left: calc(100% + 10px);
    top: 50%;
    transform: translateY(-48%);
}

.azur-contact-hub--tooltip-right .azur-contact-hub__toggle:hover .azur-contact-hub__tooltip,.azur-contact-hub--tooltip-right .azur-contact-hub__toggle:focus-visible .azur-contact-hub__tooltip {
    transform: translateY(-50%);
}

.azur-contact-hub--tooltip-top .azur-contact-hub__tooltip {
    left: 50%;
    bottom: calc(100% + 10px);
    transform: translate(-50%,2px);
}

.azur-contact-hub--tooltip-top .azur-contact-hub__toggle:hover .azur-contact-hub__tooltip,.azur-contact-hub--tooltip-top .azur-contact-hub__toggle:focus-visible .azur-contact-hub__tooltip {
    transform: translate(-50%,0);
}

.azur-contact-hub--tooltip-bottom .azur-contact-hub__tooltip {
    left: 50%;
    top: calc(100% + 10px);
    transform: translate(-50%,-2px);
}

.azur-contact-hub--tooltip-bottom .azur-contact-hub__toggle:hover .azur-contact-hub__tooltip,.azur-contact-hub--tooltip-bottom .azur-contact-hub__toggle:focus-visible .azur-contact-hub__tooltip {
    transform: translate(-50%,0);
}

.azur-contact-hub--glow .azur-contact-hub__toggle {
    box-shadow: 0 0 0 4px color-mix(in srgb,var(--ach-button-color) 20%,transparent),0 14px 42px color-mix(in srgb,var(--ach-button-color) 44%,transparent);
}

.azur-contact-hub--launcher-type-bubble .azur-contact-hub__toggle,.azur-contact-hub--launcher-type-fab .azur-contact-hub__toggle {
    width: var(--ach-button-size);
    min-width: var(--ach-button-size);
    padding: 0;
    border-radius: 999px;
}

.azur-contact-hub--launcher-type-bubble .azur-contact-hub__toggle-label,.azur-contact-hub--launcher-type-fab .azur-contact-hub__toggle-label {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border: 0;
}

.azur-contact-hub--launcher-type-square .azur-contact-hub__toggle {
    width: var(--ach-button-size);
    min-width: var(--ach-button-size);
    padding: 0;
    border-radius: min(var(--ach-button-radius),12px);
}

.azur-contact-hub--launcher-type-square .azur-contact-hub__toggle-label {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0,0,0,0);
    white-space: nowrap;
    border: 0;
}

.azur-contact-hub--launcher-type-pill .azur-contact-hub__toggle {
    border-radius: 999px;
}

.azur-contact-hub--launcher-type-dock .azur-contact-hub__toggle {
    border-radius: 14px;
    padding-inline: max(18px,var(--ach-button-padding-x));
    box-shadow: 0 9px 28px rgba(15,23,42,.22);
}

.azur-contact-hub--launcher-type-sidebar.azur-contact-hub--floating {
    top: 50%;
    bottom: auto;
    transform: translateY(-50%);
}

.azur-contact-hub--launcher-type-sidebar.azur-contact-hub--bottom-right,.azur-contact-hub--launcher-type-sidebar.azur-contact-hub--middle-right,.azur-contact-hub--launcher-type-sidebar.azur-contact-hub--top-right {
    right: 0;
}

.azur-contact-hub--launcher-type-sidebar.azur-contact-hub--bottom-left,.azur-contact-hub--launcher-type-sidebar.azur-contact-hub--middle-left,.azur-contact-hub--launcher-type-sidebar.azur-contact-hub--top-left {
    left: 0;
}

.azur-contact-hub--launcher-type-sidebar .azur-contact-hub__toggle {
    height: auto;
    min-height: var(--ach-button-size);
    writing-mode: vertical-rl;
    padding: 16px 10px;
    border-radius: 12px 0 0 12px;
}

.azur-contact-hub--launcher-type-sidebar.azur-contact-hub--bottom-left .azur-contact-hub__toggle,.azur-contact-hub--launcher-type-sidebar.azur-contact-hub--middle-left .azur-contact-hub__toggle,.azur-contact-hub--launcher-type-sidebar.azur-contact-hub--top-left .azur-contact-hub__toggle {
    border-radius: 0 12px 12px 0;
}

.azur-contact-hub--launcher-type-bottom-bar.azur-contact-hub--floating {
    left: 50%;
    right: auto;
    bottom: max(0px,env(safe-area-inset-bottom));
    top: auto;
    transform: translateX(-50%);
    width: min(680px,calc(100vw - 24px));
    align-items: stretch;
}

.azur-contact-hub--launcher-type-bottom-bar .azur-contact-hub__toggle {
    width: 100%;
    border-radius: 14px 14px 0 0;
}

.azur-contact-hub--launcher-type-bottom-bar .azur-contact-hub__panel {
    width: 100%;
    max-width: none;
}

@media (max-width:767px) {
    .azur-contact-hub--launcher-type-bottom-bar.azur-contact-hub--floating {
        width: 100%;
        left: 0;
        right: 0;
        transform: none;
    }

    .azur-contact-hub--launcher-type-bottom-bar .azur-contact-hub__toggle {
        border-radius: 14px 14px 0 0;
    }

    .azur-contact-hub--launcher-type-sidebar .azur-contact-hub__toggle {
        writing-mode: horizontal-tb;
        border-radius: 999px;
        height: var(--ach-mobile-button-size);
        padding: 0 14px;
    }

}

@media (prefers-reduced-motion:reduce) {
    .azur-contact-hub__tooltip {
        transition: none;
    }

}

.azur-contact-hub--font-system {
    font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
}

.azur-contact-hub--font-serif {
    font-family: Georgia,"Times New Roman",serif;
}

.azur-contact-hub--font-monospace {
    font-family: ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace;
}

.azur-contact-hub--dir-ltr {
    direction: ltr;
}

.azur-contact-hub--dir-rtl {
    direction: rtl;
}

.azur-contact-hub__toggle-label {
    font-size: var(--ach-launcher-font-size);
    font-weight: var(--ach-launcher-font-weight);
    letter-spacing: var(--ach-launcher-letter-spacing);
}

.azur-contact-hub__header-title {
    font-size: var(--ach-header-title-font-size);
    font-weight: var(--ach-header-title-font-weight);
}

.azur-contact-hub__header-subtitle {
    font-size: var(--ach-header-subtitle-font-size);
    line-height: var(--ach-header-subtitle-line-height);
}

.azur-contact-hub__toggle:focus-visible,.azur-contact-hub__channel:focus-visible {
    outline: var(--ach-focus-ring-width) solid var(--ach-focus-ring);
    outline-offset: 3px;
}

.azur-contact-hub--high-contrast .azur-contact-hub__panel,.azur-contact-hub--high-contrast .azur-contact-hub__channel,.azur-contact-hub--high-contrast .azur-contact-hub__toggle {
    border-width: max(2px,var(--ach-panel-border-width));
    border-style: solid;
}

.azur-contact-hub__header {
    position: relative;
    display: grid;
    gap: 10px;
    margin: calc(var(--ach-panel-padding) * -1) calc(var(--ach-panel-padding) * -1) var(--ach-gap);
    padding: 16px;
    background: var(--ach-header-bg);
    color: var(--ach-header-text);
    border-radius: var(--ach-panel-radius) var(--ach-panel-radius) 0 0;
}

.azur-contact-hub__header--divider {
    border-bottom: 1px solid color-mix(in srgb,var(--ach-header-text) 18%,transparent);
}

.azur-contact-hub__header-main {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding-right: 28px;
}

.azur-contact-hub__header-logo {
    width: 46px;
    height: 46px;
    flex: 0 0 46px;
    border-radius: 12px;
    object-fit: cover;
    background: rgba(255,255,255,.2);
}

.azur-contact-hub__header-copy {
    display: grid;
    gap: 3px;
    min-width: 0;
}

.azur-contact-hub__header-title,.azur-contact-hub__header-subtitle {
    display: block;
}

.azur-contact-hub__header-subtitle {
    opacity: .78;
}

.azur-contact-hub__header-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 7px 12px;
    margin-top: 4px;
    font-size: 11px;
    opacity: .9;
}

.azur-contact-hub__header-status,.azur-contact-hub__header-hours {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.azur-contact-hub__header-status i {
    width: 8px;
    height: 8px;
    border-radius: 999px;
    background: var(--ach-header-status);
    box-shadow: 0 0 0 3px color-mix(in srgb,var(--ach-header-status) 20%,transparent);
}

.azur-contact-hub__header-close {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 30px;
    height: 30px;
    display: grid;
    place-items: center;
    border: 0;
    border-radius: 8px;
    background: color-mix(in srgb,var(--ach-header-text) 10%,transparent);
    color: inherit;
    cursor: pointer;
}

.azur-contact-hub__header-close:hover {
    background: color-mix(in srgb,var(--ach-header-text) 18%,transparent);
}

.azur-contact-hub__header-close svg {
    width: 17px;
    height: 17px;
}

.azur-contact-hub__header-cta {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 34px;
    padding: 7px 12px;
    border: 1px solid color-mix(in srgb,var(--ach-header-text) 25%,transparent);
    border-radius: 9px;
    color: inherit;
    text-decoration: none;
    font-size: 12px;
    font-weight: 700;
}

.azur-contact-hub__header-cta:hover {
    background: color-mix(in srgb,var(--ach-header-text) 10%,transparent);
    color: inherit;
}

.azur-contact-hub__header-close:focus-visible,.azur-contact-hub__header-cta:focus-visible {
    outline: var(--ach-focus-ring-width) solid var(--ach-focus-ring);
    outline-offset: 2px;
}

@media (max-width:767px) {
    .azur-contact-hub__header {
        padding: 14px;
    }

    .azur-contact-hub__header-logo {
        width: 40px;
        height: 40px;
        flex-basis: 40px;
    }

}

/* Agents and departments */

.azur-contact-hub__agents {
    display: grid;
    gap: 8px;
    margin-bottom: var(--ach-gap);
}

.azur-contact-hub__agent {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 9px 10px;
    border: 1px solid var(--ach-panel-border);
    border-radius: var(--ach-channel-radius);
    background: color-mix(in srgb,var(--ach-panel-bg) 92%,var(--ach-button-color) 8%);
    color: var(--ach-panel-text);
    text-align: left;
    cursor: pointer;
    transition: transform .16s ease,border-color .16s ease,background .16s ease;
}

.azur-contact-hub__agent:hover,.azur-contact-hub__agent[aria-pressed="true"] {
    transform: translateY(-1px);
    border-color: var(--ach-button-color);
    background: color-mix(in srgb,var(--ach-panel-bg) 84%,var(--ach-button-color) 16%);
}

.azur-contact-hub__agent-avatar {
    position: relative;
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    display: grid;
    place-items: center;
    border-radius: 999px;
    overflow: visible;
    background: var(--ach-button-color);
    color: var(--ach-button-text);
    font-weight: 800;
}

.azur-contact-hub__agent-avatar img {
    width: 100%;
    height: 100%;
    border-radius: inherit;
    object-fit: cover;
}

.azur-contact-hub__agent-avatar i {
    position: absolute;
    right: -1px;
    bottom: 1px;
    width: 10px;
    height: 10px;
    border: 2px solid var(--ach-panel-bg);
    border-radius: 999px;
    background: #94a3b8;
}

.azur-contact-hub__agent-avatar i.is-online {
    background: #22c55e;
}

.azur-contact-hub__agent-copy {
    display: grid;
    gap: 1px;
    min-width: 0;
}

.azur-contact-hub__agent-copy strong,.azur-contact-hub__agent-copy small,.azur-contact-hub__agent-copy em {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.azur-contact-hub__agent-copy strong {
    font-size: 13px;
}

.azur-contact-hub__agent-copy small {
    font-size: 11px;
    opacity: .78;
}

.azur-contact-hub__agent-copy em {
    font-size: 10px;
    font-style: normal;
    opacity: .62;
}

.azur-contact-hub__agent:focus-visible {
    outline: var(--ach-focus-ring-width) solid var(--ach-focus-ring);
    outline-offset: 2px;
}

@media (prefers-reduced-motion:reduce) {
    .azur-contact-hub__agent {
        transition: none;
    }

}

.azur-contact-hub {
    --ach-animation-duration: 240ms;
    --ach-animation-delay: 35ms;
    --ach-animation-easing: cubic-bezier(.16,1,.3,1);
}

.azur-contact-hub--easing-linear {
    --ach-animation-easing: linear;
}

.azur-contact-hub--easing-ease {
    --ach-animation-easing: ease;
}

.azur-contact-hub--easing-ease-in {
    --ach-animation-easing: ease-in;
}

.azur-contact-hub--easing-ease-out {
    --ach-animation-easing: ease-out;
}

.azur-contact-hub--easing-ease-in-out {
    --ach-animation-easing: ease-in-out;
}

.azur-contact-hub--easing-spring {
    --ach-animation-easing: cubic-bezier(.2,1.45,.45,1);
}

.azur-contact-hub.is-open .azur-contact-hub__panel {
    animation-duration: var(--ach-animation-duration);
    animation-timing-function: var(--ach-animation-easing);
    animation-fill-mode: both;
}

.azur-contact-hub.is-open.azur-contact-hub--animation-fade-down .azur-contact-hub__panel {
    animation-name: achFadeDown;
}

.azur-contact-hub.is-open.azur-contact-hub--animation-slide-left .azur-contact-hub__panel {
    animation-name: achSlideLeft;
}

.azur-contact-hub.is-open.azur-contact-hub--animation-slide-right .azur-contact-hub__panel {
    animation-name: achSlideRight;
}

.azur-contact-hub.is-open.azur-contact-hub--animation-pop .azur-contact-hub__panel {
    animation-name: achPop;
}

.azur-contact-hub.is-open.azur-contact-hub--animation-flip .azur-contact-hub__panel {
    animation-name: achFlip;
}

.azur-contact-hub.is-open.azur-contact-hub--animation-blur .azur-contact-hub__panel {
    animation-name: achBlur;
}

.azur-contact-hub.is-open.azur-contact-hub--animation-spring .azur-contact-hub__panel {
    animation-name: achSpring;
}

@keyframes achFadeDown {
    from {
        opacity: 0;
        transform: translateY(-12px);
    }

    to {
        opacity: 1;
        transform: none;
    }

}

@keyframes achSlideLeft {
    from {
        opacity: 0;
        transform: translateX(18px);
    }

    to {
        opacity: 1;
        transform: none;
    }

}

@keyframes achSlideRight {
    from {
        opacity: 0;
        transform: translateX(-18px);
    }

    to {
        opacity: 1;
        transform: none;
    }

}

@keyframes achPop {
    0% {
        opacity: 0;
        transform: scale(.72);
    }

    70% {
        opacity: 1;
        transform: scale(1.05);
    }

    100% {
        transform: scale(1);
    }

}

@keyframes achFlip {
    from {
        opacity: 0;
        transform: perspective(700px) rotateX(-18deg) translateY(8px);
    }

    to {
        opacity: 1;
        transform: none;
    }

}

@keyframes achBlur {
    from {
        opacity: 0;
        filter: blur(10px);
        transform: scale(.97);
    }

    to {
        opacity: 1;
        filter: none;
        transform: none;
    }

}

@keyframes achSpring {
    0% {
        opacity: 0;
        transform: scale(.78);
    }

    65% {
        opacity: 1;
        transform: scale(1.06);
    }

    82% {
        transform: scale(.98);
    }

    100% {
        transform: scale(1);
    }

}

.azur-contact-hub--launcher-animation-pulse .azur-contact-hub__toggle {
    animation: achLauncherPulse 1.8s var(--ach-animation-easing) infinite;
}

.azur-contact-hub--launcher-animation-float .azur-contact-hub__toggle {
    animation: achLauncherFloat 2.8s ease-in-out infinite;
}

.azur-contact-hub--launcher-animation-bounce .azur-contact-hub__toggle {
    animation: achLauncherBounce 1.7s ease-in-out infinite;
}

.azur-contact-hub--launcher-animation-shake .azur-contact-hub__toggle {
    animation: achLauncherShake 2.5s ease-in-out infinite;
}

.azur-contact-hub--launcher-animation-glow .azur-contact-hub__toggle {
    animation: achLauncherGlow 1.9s ease-in-out infinite;
}

.azur-contact-hub--launcher-animation-rotate .azur-contact-hub__toggle-icon {
    animation: achLauncherRotate 4s linear infinite;
}

.azur-contact-hub--launcher-animation-heartbeat .azur-contact-hub__toggle {
    animation: achLauncherHeartbeat 1.8s ease-in-out infinite;
}

.azur-contact-hub:not(.azur-contact-hub--animation-loop):not(:hover):not(:focus-within) .azur-contact-hub__toggle {
    animation-iteration-count: 1;
}

@keyframes achLauncherPulse {
    0%,100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.06);
    }

}

@keyframes achLauncherFloat {
    0%,100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-7px);
    }

}

@keyframes achLauncherBounce {
    0%,72%,100% {
        transform: translateY(0);
    }

    82% {
        transform: translateY(-8px);
    }

    90% {
        transform: translateY(-3px);
    }

}

@keyframes achLauncherShake {
    0%,84%,100% {
        transform: rotate(0);
    }

    88% {
        transform: rotate(-4deg);
    }

    92% {
        transform: rotate(4deg);
    }

    96% {
        transform: rotate(-2deg);
    }

}

@keyframes achLauncherGlow {
    0%,100% {
        box-shadow: 0 12px 34px rgba(15,23,42,.25);
    }

    50% {
        box-shadow: 0 0 0 8px color-mix(in srgb,var(--ach-button-color) 18%,transparent),0 16px 42px color-mix(in srgb,var(--ach-button-color) 45%,transparent);
    }

}

@keyframes achLauncherRotate {
    to {
        transform: rotate(360deg);
    }

}

@keyframes achLauncherHeartbeat {
    0%,28%,100% {
        transform: scale(1);
    }

    12% {
        transform: scale(1.08);
    }

    20% {
        transform: scale(1.03);
    }

}

.azur-contact-hub.is-open.azur-contact-hub--channel-animation-stagger-fade .azur-contact-hub__channel,.azur-contact-hub.is-open.azur-contact-hub--channel-animation-stagger-fade-up .azur-contact-hub__channel,.azur-contact-hub.is-open.azur-contact-hub--channel-animation-stagger-scale .azur-contact-hub__channel,.azur-contact-hub.is-open.azur-contact-hub--channel-animation-stagger-slide .azur-contact-hub__channel {
    animation-duration: var(--ach-animation-duration);
    animation-timing-function: var(--ach-animation-easing);
    animation-fill-mode: both;
    animation-delay: calc(var(--ach-animation-delay) * var(--ach-index,0));
}

.azur-contact-hub.is-open.azur-contact-hub--channel-animation-stagger-fade .azur-contact-hub__channel {
    animation-name: achChannelFade;
}

.azur-contact-hub.is-open.azur-contact-hub--channel-animation-stagger-fade-up .azur-contact-hub__channel {
    animation-name: achChannelFadeUp;
}

.azur-contact-hub.is-open.azur-contact-hub--channel-animation-stagger-scale .azur-contact-hub__channel {
    animation-name: achChannelScale;
}

.azur-contact-hub.is-open.azur-contact-hub--channel-animation-stagger-slide .azur-contact-hub__channel {
    animation-name: achChannelSlide;
}

.azur-contact-hub__channel:nth-of-type(1) {
    --ach-index: 1;
}

.azur-contact-hub__channel:nth-of-type(2) {
    --ach-index: 2;
}

.azur-contact-hub__channel:nth-of-type(3) {
    --ach-index: 3;
}

.azur-contact-hub__channel:nth-of-type(4) {
    --ach-index: 4;
}

.azur-contact-hub__channel:nth-of-type(5) {
    --ach-index: 5;
}

.azur-contact-hub__channel:nth-of-type(6) {
    --ach-index: 6;
}

.azur-contact-hub__channel:nth-of-type(7) {
    --ach-index: 7;
}

.azur-contact-hub__channel:nth-of-type(8) {
    --ach-index: 8;
}

.azur-contact-hub__channel:nth-of-type(n+9) {
    --ach-index: 9;
}

@keyframes achChannelFade {
    from {
        opacity: 0;
    }

    to {
        opacity: 1;
    }

}

@keyframes achChannelFadeUp {
    from {
        opacity: 0;
        transform: translateY(8px);
    }

    to {
        opacity: 1;
        transform: none;
    }

}

@keyframes achChannelScale {
    from {
        opacity: 0;
        transform: scale(.9);
    }

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

}

@keyframes achChannelSlide {
    from {
        opacity: 0;
        transform: translateX(12px);
    }

    to {
        opacity: 1;
        transform: none;
    }

}

.azur-contact-hub--hover-animation-none .azur-contact-hub__channel:hover,.azur-contact-hub--hover-animation-none .azur-contact-hub__channel:focus-visible {
    transform: none;
    box-shadow: none;
}

.azur-contact-hub--hover-animation-scale .azur-contact-hub__channel:hover,.azur-contact-hub--hover-animation-scale .azur-contact-hub__channel:focus-visible {
    transform: scale(1.025);
}

.azur-contact-hub--hover-animation-glow .azur-contact-hub__channel:hover,.azur-contact-hub--hover-animation-glow .azur-contact-hub__channel:focus-visible {
    transform: none;
    box-shadow: 0 0 0 4px color-mix(in srgb,var(--ach-channel-color) 20%,transparent),0 9px 24px color-mix(in srgb,var(--ach-channel-color) 30%,transparent);
}

.azur-contact-hub--hover-animation-tilt .azur-contact-hub__channel:hover,.azur-contact-hub--hover-animation-tilt .azur-contact-hub__channel:focus-visible {
    transform: perspective(500px) rotateX(2deg) rotateY(-2deg) translateY(-1px);
}

.azur-contact-hub--badge-animation-pulse .azur-contact-hub__badge,.azur-contact-hub--badge-animation-pulse .azur-contact-hub__notification-dot {
    animation: achBadgePulse 1.6s ease-in-out infinite;
}

.azur-contact-hub--badge-animation-bounce .azur-contact-hub__badge,.azur-contact-hub--badge-animation-bounce .azur-contact-hub__notification-dot {
    animation: achBadgeBounce 1.8s ease-in-out infinite;
}

.azur-contact-hub--badge-animation-shake .azur-contact-hub__badge,.azur-contact-hub--badge-animation-shake .azur-contact-hub__notification-dot {
    animation: achBadgeShake 2.2s ease-in-out infinite;
}

@keyframes achBadgePulse {
    0%,100% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.14);
    }

}

@keyframes achBadgeBounce {
    0%,70%,100% {
        transform: translateY(0);
    }

    80% {
        transform: translateY(-4px);
    }

    90% {
        transform: translateY(-1px);
    }

}

@keyframes achBadgeShake {
    0%,84%,100% {
        transform: translateX(0);
    }

    88% {
        transform: translateX(-2px);
    }

    92% {
        transform: translateX(2px);
    }

    96% {
        transform: translateX(-1px);
    }

}

@media (prefers-reduced-motion:reduce) {
    .azur-contact-hub,.azur-contact-hub * {
        scroll-behavior: auto !important;
    }

    .azur-contact-hub__panel,.azur-contact-hub__channel,.azur-contact-hub__toggle,.azur-contact-hub__toggle-icon,.azur-contact-hub__badge,.azur-contact-hub__notification-dot {
        animation: none !important;
        transition-duration: .01ms !important;
    }

}

.azur-contact-hub__sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0,0,0,0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.azur-contact-hub__panel:focus {
    outline: none;
}

.azur-contact-hub__panel:focus-visible {
    outline: var(--ach-focus-ring-width) solid var(--ach-focus-ring);
    outline-offset: 3px;
}

.azur-contact-hub :where(a,button,[tabindex]):focus-visible {
    outline: var(--ach-focus-ring-width) solid var(--ach-focus-ring) !important;
    outline-offset: 3px;
}

.azur-contact-hub__toggle,.azur-contact-hub__header-close,.azur-contact-hub__agent,.azur-contact-hub__channel {
    min-width: 44px;
    min-height: 44px;
}

.azur-contact-hub__header-close {
    display: grid;
    place-items: center;
}

.azur-contact-hub__channel[hidden] {
    display: none !important;
}

/* Accessibility and forced colors */

@media (forced-colors:active) {
    .azur-contact-hub,.azur-contact-hub * {
        forced-color-adjust: auto;
    }

    .azur-contact-hub__toggle,.azur-contact-hub__panel,.azur-contact-hub__channel,.azur-contact-hub__agent,.azur-contact-hub__header-cta,.azur-contact-hub__header-close {
        border: 1px solid ButtonText !important;
        box-shadow: none !important;
    }

    .azur-contact-hub__toggle,.azur-contact-hub__channel,.azur-contact-hub__header-cta {
        background: ButtonFace !important;
        color: ButtonText !important;
    }

    .azur-contact-hub__agent[aria-pressed="true"] {
        outline: 3px solid Highlight !important;
    }

    .azur-contact-hub__online-dot,.azur-contact-hub__notification-dot,.azur-contact-hub__agent-avatar i {
        border: 2px solid CanvasText !important;
    }

}

/* Print behavior */

@media print {
    .azur-contact-hub--floating {
        display: none !important;
    }

}

.azur-contact-hub__panel {
    overscroll-behavior: contain;
}

.azur-contact-hub__toggle,.azur-contact-hub__panel,.azur-contact-hub__channel {
    backface-visibility: hidden;
}

.azur-contact-hub:not(.is-open) .azur-contact-hub__panel[hidden] {
    display: none !important;
}

@media (prefers-reduced-data:reduce) {
    .azur-contact-hub--glow .azur-contact-hub__toggle {
        box-shadow: 0 10px 28px rgba(15,23,42,.2);
    }

    .azur-contact-hub__agent-avatar img,.azur-contact-hub__header-logo {
        content-visibility: auto;
    }

}

template[data-azur-floating-contact-template] {
    display: none !important;
}

.azur-contact-hub,.azur-contact-hub *,.azur-contact-hub *::before,.azur-contact-hub *::after {
    box-sizing: border-box;
}

.azur-contact-hub {
    width: auto;
    max-width: none;
    margin: 0;
    padding: 0;
    border: 0;
    text-align: start;
    float: none;
    clear: none;
}

.azur-contact-hub img,.azur-contact-hub svg {
    max-width: none;
}

.azur-contact-hub--floating {
    position: fixed !important;
    pointer-events: auto;
}

.azur-contact-hub--channel-display-icon-label .azur-contact-hub__channel-label {
    position: static !important;
    width: auto !important;
    height: auto !important;
    padding: 0 !important;
    margin: 0 !important;
    overflow: visible !important;
    clip: auto !important;
    white-space: normal !important;
    border: 0 !important;
    display: inline !important;
    min-width: 0;
    flex: 1;
}

.azur-contact-hub--channel-display-icon .azur-contact-hub__channel-label {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0,0,0,0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

.azur-contact-hub--channel-display-icon .azur-contact-hub__channel {
    justify-content: center;
    min-width: var(--ach-channel-height);
    padding-left: 8px;
    padding-right: 8px;
}

.azur-contact-hub--channel-display-icon-label.azur-contact-hub--layout-dock .azur-contact-hub__channel-label,.azur-contact-hub--channel-display-icon-label.azur-contact-hub--layout-compact .azur-contact-hub__channel-label {
    position: static !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    clip: auto !important;
    white-space: normal !important;
    overflow: visible !important;
}

.azur-contact-hub--channel-display-icon-label.azur-contact-hub--layout-dock .azur-contact-hub__channel,.azur-contact-hub--channel-display-icon-label.azur-contact-hub--layout-compact .azur-contact-hub__channel {
    justify-content: flex-start;
    min-width: max-content;
    padding-left: var(--ach-channel-padding-x);
    padding-right: var(--ach-channel-padding-x);
}

.azur-contact-hub--pulse .azur-contact-hub__toggle::before,.azur-contact-hub--pulse .azur-contact-hub__toggle::after {
    content: "";
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    z-index: -1;
    opacity: 0;
}

.azur-contact-hub--pulse-soft-ring:not(.is-open):not(.has-interacted) .azur-contact-hub__toggle::before {
    border: 2px solid var(--ach-pulse-color);
    animation: achAttentionRing var(--ach-pulse-cycle) ease-out infinite;
}

.azur-contact-hub--pulse-double-wave:not(.is-open):not(.has-interacted) .azur-contact-hub__toggle::before,.azur-contact-hub--pulse-double-wave:not(.is-open):not(.has-interacted) .azur-contact-hub__toggle::after {
    border: 2px solid var(--ach-pulse-color);
    animation: achAttentionRing var(--ach-pulse-cycle) ease-out infinite;
}

.azur-contact-hub--pulse-double-wave:not(.is-open):not(.has-interacted) .azur-contact-hub__toggle::after {
    animation-delay: calc(var(--ach-pulse-duration) * .42);
}

.azur-contact-hub--pulse-glow-breathe:not(.is-open):not(.has-interacted) .azur-contact-hub__toggle {
    animation: achAttentionGlow var(--ach-pulse-cycle) ease-in-out infinite;
}

.azur-contact-hub--pulse-attention-pop:not(.is-open):not(.has-interacted) .azur-contact-hub__toggle {
    animation: achAttentionPop var(--ach-pulse-cycle) ease-in-out infinite;
}

.azur-contact-hub--pulse-attention-pop:not(.is-open):not(.has-interacted) .azur-contact-hub__toggle::before {
    border: 2px solid var(--ach-pulse-color);
    animation: achAttentionRing var(--ach-pulse-cycle) ease-out infinite;
}

.azur-contact-hub.is-open .azur-contact-hub__toggle::before,.azur-contact-hub.is-open .azur-contact-hub__toggle::after,.azur-contact-hub.has-interacted.azur-contact-hub--pulse-stop-interaction .azur-contact-hub__toggle::before,.azur-contact-hub.has-interacted.azur-contact-hub--pulse-stop-interaction .azur-contact-hub__toggle::after {
    animation: none !important;
    opacity: 0 !important;
}

.azur-contact-hub.has-interacted.azur-contact-hub--pulse-stop-interaction .azur-contact-hub__toggle {
    animation: none !important;
}

@keyframes achAttentionRing {
    0% {
        opacity: 0;
        transform: scale(1);
    }

    7% {
        opacity: var(--ach-pulse-opacity);
    }

    42% {
        opacity: 0;
        transform: scale(var(--ach-pulse-scale));
    }

    100% {
        opacity: 0;
        transform: scale(var(--ach-pulse-scale));
    }

}

@keyframes achAttentionGlow {
    0%,48%,100% {
        box-shadow: 0 12px 34px rgba(15,23,42,.25);
    }

    8%,24% {
        box-shadow: 0 12px 34px rgba(15,23,42,.25),0 0 0 calc(var(--ach-pulse-spread) * .55) var(--ach-pulse-rgba);
        transform: scale(1.025);
    }

}

@keyframes achAttentionPop {
    0%,48%,100% {
        transform: scale(1);
    }

    7% {
        transform: scale(1.07);
    }

    14% {
        transform: scale(.985);
    }

    22% {
        transform: scale(1.025);
    }

    30% {
        transform: scale(1);
    }

}

@media (max-width:767px) {
    .azur-contact-hub--mobile-labels-hidden .azur-contact-hub__channel-label {
        position: absolute !important;
        width: 1px !important;
        height: 1px !important;
        padding: 0 !important;
        margin: -1px !important;
        overflow: hidden !important;
        clip: rect(0,0,0,0) !important;
        white-space: nowrap !important;
        border: 0 !important;
    }

    .azur-contact-hub--mobile-labels-hidden .azur-contact-hub__channel {
        justify-content: center;
        min-width: var(--ach-channel-height);
        padding-left: 8px;
        padding-right: 8px;
    }

}

@media (prefers-reduced-motion:reduce) {
    .azur-contact-hub--pulse .azur-contact-hub__toggle,.azur-contact-hub--pulse .azur-contact-hub__toggle::before,.azur-contact-hub--pulse .azur-contact-hub__toggle::after {
        animation: none !important;
        opacity: 0 !important;
    }

}

.azur-contact-hub {
    --ach-motion-distance: 8px;
    --ach-motion-distance-negative: -8px;
    --ach-motion-scale: .97;
}

.azur-contact-hub.is-open.azur-contact-hub--animation-fade-up .azur-contact-hub__panel {
    animation-name: achMotionFadeUp;
}

.azur-contact-hub.is-open.azur-contact-hub--animation-fade-down .azur-contact-hub__panel {
    animation-name: achMotionFadeDown;
}

.azur-contact-hub.is-open.azur-contact-hub--animation-scale .azur-contact-hub__panel {
    animation-name: achMotionScale;
}

.azur-contact-hub.is-open.azur-contact-hub--animation-slide .azur-contact-hub__panel {
    animation-name: achMotionSlide;
}

.azur-contact-hub.is-open.azur-contact-hub--animation-slide-left .azur-contact-hub__panel {
    animation-name: achMotionSlideLeft;
}

.azur-contact-hub.is-open.azur-contact-hub--animation-slide-right .azur-contact-hub__panel {
    animation-name: achMotionSlideRight;
}

.azur-contact-hub.is-open.azur-contact-hub--animation-pop .azur-contact-hub__panel {
    animation-name: achMotionPop;
}

.azur-contact-hub.is-open.azur-contact-hub--animation-spring .azur-contact-hub__panel {
    animation-name: achMotionSpring;
}

.azur-contact-hub.is-open.azur-contact-hub--channel-animation-stagger-fade-up .azur-contact-hub__channel {
    animation-name: achMotionChannelFadeUp;
}

.azur-contact-hub.is-open.azur-contact-hub--channel-animation-stagger-scale .azur-contact-hub__channel {
    animation-name: achMotionChannelScale;
}

.azur-contact-hub.is-open.azur-contact-hub--channel-animation-stagger-slide .azur-contact-hub__channel {
    animation-name: achMotionChannelSlide;
}

.azur-contact-hub--motion-material-expressive {
    --ach-animation-easing: cubic-bezier(.2,0,0,1);
}

.azur-contact-hub--motion-cupertino-flow {
    --ach-animation-easing: cubic-bezier(.25,.8,.25,1);
}

.azur-contact-hub--motion-fluent-natural {
    --ach-animation-easing: cubic-bezier(.16,1,.3,1);
}

.azur-contact-hub--motion-luxury-drift {
    --ach-animation-easing: cubic-bezier(.22,1,.36,1);
}

.azur-contact-hub--motion-glass-float {
    --ach-animation-easing: cubic-bezier(.16,1,.3,1);
}

.azur-contact-hub--motion-soft-spring {
    --ach-animation-easing: cubic-bezier(.34,1.35,.64,1);
}

.azur-contact-hub--motion-corporate-crisp {
    --ach-animation-easing: cubic-bezier(.16,1,.3,1);
}

.azur-contact-hub--motion-dynamic-impact {
    --ach-animation-easing: cubic-bezier(.34,1.56,.64,1);
}

@keyframes achMotionFadeUp {
    from {
        opacity: 0;
        transform: translateY(var(--ach-motion-distance));
    }

    to {
        opacity: 1;
        transform: none;
    }

}

@keyframes achMotionFadeDown {
    from {
        opacity: 0;
        transform: translateY(var(--ach-motion-distance-negative));
    }

    to {
        opacity: 1;
        transform: none;
    }

}

@keyframes achMotionScale {
    from {
        opacity: 0;
        transform: scale(var(--ach-motion-scale));
    }

    to {
        opacity: 1;
        transform: none;
    }

}

@keyframes achMotionSlide {
    from {
        opacity: 0;
        transform: translateX(var(--ach-motion-distance));
    }

    to {
        opacity: 1;
        transform: none;
    }

}

@keyframes achMotionSlideLeft {
    from {
        opacity: 0;
        transform: translateX(var(--ach-motion-distance-negative));
    }

    to {
        opacity: 1;
        transform: none;
    }

}

@keyframes achMotionSlideRight {
    from {
        opacity: 0;
        transform: translateX(var(--ach-motion-distance));
    }

    to {
        opacity: 1;
        transform: none;
    }

}

@keyframes achMotionPop {
    0% {
        opacity: 0;
        transform: scale(var(--ach-motion-scale));
    }

    72% {
        opacity: 1;
        transform: scale(1.025);
    }

    100% {
        transform: none;
    }

}

@keyframes achMotionSpring {
    0% {
        opacity: 0;
        transform: translateY(var(--ach-motion-distance)) scale(var(--ach-motion-scale));
    }

    72% {
        opacity: 1;
        transform: translateY(-2px) scale(1.012);
    }

    100% {
        transform: none;
    }

}

@keyframes achMotionChannelFadeUp {
    from {
        opacity: 0;
        transform: translateY(var(--ach-motion-distance));
    }

    to {
        opacity: 1;
        transform: none;
    }

}

@keyframes achMotionChannelScale {
    from {
        opacity: 0;
        transform: scale(var(--ach-motion-scale));
    }

    to {
        opacity: 1;
        transform: none;
    }

}

@keyframes achMotionChannelSlide {
    from {
        opacity: 0;
        transform: translateX(var(--ach-motion-distance));
    }

    to {
        opacity: 1;
        transform: none;
    }

}

@media (prefers-reduced-motion:reduce) {
    .azur-contact-hub {
        --ach-motion-distance: 0px;
        --ach-motion-distance-negative: 0px;
        --ach-motion-scale: 1;
    }

}

.azur-contact-hub--pulse {
    --ach-pulse-secondary: color-mix(in srgb,var(--ach-pulse-color) 58%,white);
    --ach-pulse-highlight: color-mix(in srgb,var(--ach-pulse-color) 28%,white);
}

.azur-contact-hub--pulse .azur-contact-hub__toggle {
    isolation: isolate;
    overflow: visible;
    will-change: transform;
}

.azur-contact-hub.is-attention-preview-replay {
    --ach-pulse-cycle: 1800ms !important;
}

.azur-contact-hub__attention {
    position: absolute;
    inset: 0;
    border-radius: inherit;
    pointer-events: none;
    z-index: 0;
}

.azur-contact-hub__attention-layer,.azur-contact-hub__attention-shimmer {
    position: absolute;
    inset: 0;
    border-radius: inherit;
    opacity: 0;
    pointer-events: none;
}

.azur-contact-hub__attention-layer {
    border: 0 solid var(--ach-pulse-color);
    transform-origin: center;
}

.azur-contact-hub__attention-layer--two {
    border-color: var(--ach-pulse-secondary);
}

.azur-contact-hub__attention-layer--three {
    border-color: var(--ach-pulse-highlight);
}

.azur-contact-hub__attention-shimmer {
    z-index: 1;
    inset: 1px;
    background: linear-gradient(112deg,transparent 12%,rgba(255,255,255,.06) 28%,var(--ach-pulse-highlight) 45%,rgba(255,255,255,.18) 60%,transparent 78%);
    background-size: 260% 100%;
    mix-blend-mode: screen;
}

.azur-contact-hub__toggle-icon,.azur-contact-hub__toggle-label {
    position: relative;
    z-index: 2;
}

.azur-contact-hub--pulse-soft-halo.is-attention-active:not(.has-interacted):not(.is-attention-preview-paused) .azur-contact-hub__attention-layer--one {
    box-shadow: 0 0 0 0 var(--ach-pulse-rgba),0 0 18px 0 var(--ach-pulse-secondary);
    animation: achAttentionSoftHalo var(--ach-pulse-cycle) cubic-bezier(.22,.7,.2,1) infinite;
}

.azur-contact-hub--pulse-concentric-wave.is-attention-active:not(.has-interacted):not(.is-attention-preview-paused) .azur-contact-hub__attention-layer--one,.azur-contact-hub--pulse-concentric-wave.is-attention-active:not(.has-interacted):not(.is-attention-preview-paused) .azur-contact-hub__attention-layer--two {
    border-width: 2px;
    box-shadow: 0 0 14px var(--ach-pulse-rgba);
    animation: achAttentionWave var(--ach-pulse-cycle) cubic-bezier(.2,.75,.25,1) infinite;
}

.azur-contact-hub--pulse-concentric-wave.is-attention-active .azur-contact-hub__attention-layer--two {
    animation-delay: calc(var(--ach-pulse-duration)*.34);
}

.azur-contact-hub--pulse-radar-sweep.is-attention-active:not(.has-interacted):not(.is-attention-preview-paused) .azur-contact-hub__attention-layer--one {
    inset: calc(var(--ach-pulse-spread)*-.55);
    background: conic-gradient(from 0deg,transparent 0 60%,var(--ach-pulse-rgba) 73%,var(--ach-pulse-secondary) 82%,var(--ach-pulse-highlight) 86%,transparent 93%);
    mask: radial-gradient(circle,transparent 55%,#000 58%,#000 65%,transparent 68%);
    animation: achAttentionRadar var(--ach-pulse-cycle) linear infinite;
}

.azur-contact-hub--pulse-radar-sweep.is-attention-active:not(.has-interacted):not(.is-attention-preview-paused) .azur-contact-hub__attention-layer--two {
    border-width: 1px;
    box-shadow: 0 0 12px var(--ach-pulse-rgba);
    animation: achAttentionBeacon var(--ach-pulse-cycle) ease-out infinite;
}

.azur-contact-hub--pulse-ripple-burst.is-attention-active:not(.has-interacted):not(.is-attention-preview-paused) .azur-contact-hub__attention-layer--one,.azur-contact-hub--pulse-ripple-burst.is-attention-active:not(.has-interacted):not(.is-attention-preview-paused) .azur-contact-hub__attention-layer--two {
    border-width: 2px;
    box-shadow: 0 0 16px var(--ach-pulse-rgba);
    animation: achAttentionBurst var(--ach-pulse-cycle) cubic-bezier(.16,.82,.24,1) infinite;
}

.azur-contact-hub--pulse-ripple-burst.is-attention-active .azur-contact-hub__attention-layer--two {
    animation-delay: calc(var(--ach-pulse-duration)*.18);
}

.azur-contact-hub--pulse-shimmer-edge.is-attention-active:not(.has-interacted):not(.is-attention-preview-paused) .azur-contact-hub__attention-shimmer {
    animation: achAttentionShimmer var(--ach-pulse-cycle) ease-in-out infinite;
}

.azur-contact-hub--pulse-shimmer-edge.is-attention-active:not(.has-interacted):not(.is-attention-preview-paused) .azur-contact-hub__attention-layer--one {
    border-width: 1px;
    box-shadow: inset 0 0 0 1px var(--ach-pulse-highlight),0 0 18px var(--ach-pulse-rgba);
    animation: achAttentionEdgeGlow var(--ach-pulse-cycle) ease-in-out infinite;
}

.azur-contact-hub--pulse-notification-pop.is-attention-active:not(.has-interacted):not(.is-attention-preview-paused) .azur-contact-hub__toggle {
    animation: achAttentionNotificationPop var(--ach-pulse-cycle) cubic-bezier(.2,.82,.2,1) infinite;
}

.azur-contact-hub--pulse-notification-pop.is-attention-active:not(.has-interacted):not(.is-attention-preview-paused) .azur-contact-hub__attention-layer--one {
    border-width: 2px;
    box-shadow: 0 0 18px var(--ach-pulse-rgba);
    animation: achAttentionBeacon var(--ach-pulse-cycle) ease-out infinite;
}

.azur-contact-hub--pulse-notification-pop.is-attention-active:not(.has-interacted):not(.is-attention-preview-paused) .azur-contact-hub__attention-layer--three,.azur-contact-hub--pulse-online-beacon.is-attention-active:not(.has-interacted):not(.is-attention-preview-paused) .azur-contact-hub__attention-layer--three {
    inset: auto 3px 3px auto;
    width: 10px;
    height: 10px;
    border: 2px solid #fff;
    border-radius: 50%;
    background: var(--ach-pulse-secondary);
    box-shadow: 0 0 0 0 var(--ach-pulse-rgba);
    animation: achAttentionDot var(--ach-pulse-cycle) ease-out infinite;
    z-index: 3;
}

.azur-contact-hub--pulse-online-beacon.is-attention-active:not(.has-interacted):not(.is-attention-preview-paused) .azur-contact-hub__attention-layer--one {
    box-shadow: 0 0 0 0 var(--ach-pulse-rgba);
    animation: achAttentionSoftHalo var(--ach-pulse-cycle) ease-in-out infinite;
}

.azur-contact-hub--pulse-online-beacon.is-attention-active:not(.has-interacted):not(.is-attention-preview-paused) .azur-contact-hub__online-dot {
    animation: achOnlineBeacon var(--ach-pulse-cycle) ease-in-out infinite;
}

.azur-contact-hub--attention-stop-open.is-open .azur-contact-hub__toggle,.azur-contact-hub--attention-stop-open.is-open .azur-contact-hub__attention-layer,.azur-contact-hub--attention-stop-open.is-open .azur-contact-hub__attention-shimmer,.azur-contact-hub--attention-stop-open.is-open .azur-contact-hub__online-dot,.azur-contact-hub.is-attention-preview-paused .azur-contact-hub__toggle,.azur-contact-hub.is-attention-preview-paused .azur-contact-hub__attention-layer,.azur-contact-hub.is-attention-preview-paused .azur-contact-hub__attention-shimmer,.azur-contact-hub.is-attention-preview-paused .azur-contact-hub__online-dot {
    animation-play-state: paused !important;
}

.azur-contact-hub--attention-stop-open.is-open .azur-contact-hub__attention-layer,.azur-contact-hub--attention-stop-open.is-open .azur-contact-hub__attention-shimmer,.azur-contact-hub.is-attention-preview-paused .azur-contact-hub__attention-layer,.azur-contact-hub.is-attention-preview-paused .azur-contact-hub__attention-shimmer {
    opacity: 0 !important;
}

@keyframes achAttentionSoftHalo {
    0%,54%,100% {
        opacity: 0;
        box-shadow: 0 0 0 0 var(--ach-pulse-rgba),0 0 0 transparent;
        transform: scale(.99);
    }

    6% {
        opacity: .98;
        box-shadow: 0 0 0 calc(var(--ach-pulse-spread)*.16) var(--ach-pulse-rgba),0 0 24px calc(var(--ach-pulse-spread)*.08) var(--ach-pulse-secondary);
        transform: scale(1.018);
    }

    19% {
        opacity: .68;
        box-shadow: 0 0 0 calc(var(--ach-pulse-spread)*.52) var(--ach-pulse-rgba),0 0 34px calc(var(--ach-pulse-spread)*.18) var(--ach-pulse-secondary);
    }

    34% {
        opacity: 0;
        box-shadow: 0 0 0 var(--ach-pulse-spread) transparent,0 0 38px calc(var(--ach-pulse-spread)*.22) transparent;
        transform: scale(1);
    }

}

@keyframes achAttentionWave {
    0%,58%,100% {
        opacity: 0;
        transform: scale(.97);
    }

    6% {
        opacity: calc(var(--ach-pulse-opacity)*1.55);
    }

    25% {
        opacity: calc(var(--ach-pulse-opacity)*.78);
    }

    40% {
        opacity: 0;
        transform: scale(var(--ach-pulse-scale));
    }

}

@keyframes achAttentionRadar {
    0%,54%,100% {
        opacity: 0;
        transform: rotate(0);
    }

    5% {
        opacity: calc(var(--ach-pulse-opacity)*1.65);
    }

    32% {
        opacity: calc(var(--ach-pulse-opacity)*1.2);
        transform: rotate(290deg);
    }

    48% {
        opacity: 0;
        transform: rotate(360deg);
    }

}

@keyframes achAttentionBeacon {
    0%,58%,100% {
        opacity: 0;
        transform: scale(.96);
    }

    7% {
        opacity: calc(var(--ach-pulse-opacity)*1.5);
    }

    27% {
        opacity: calc(var(--ach-pulse-opacity)*.72);
    }

    39% {
        opacity: 0;
        transform: scale(var(--ach-pulse-scale));
    }

}

@keyframes achAttentionBurst {
    0%,62%,100% {
        opacity: 0;
        transform: scale(.9);
    }

    5% {
        opacity: calc(var(--ach-pulse-opacity)*1.65);
    }

    18% {
        opacity: calc(var(--ach-pulse-opacity)*.92);
    }

    32% {
        opacity: 0;
        transform: scale(var(--ach-pulse-scale));
    }

}

@keyframes achAttentionShimmer {
    0%,58%,100% {
        opacity: 0;
        background-position: 145% 0;
    }

    6% {
        opacity: .98;
    }

    30% {
        opacity: .8;
        background-position: -30% 0;
    }

    40% {
        opacity: 0;
        background-position: -90% 0;
    }

}

@keyframes achAttentionEdgeGlow {
    0%,58%,100% {
        opacity: 0;
    }

    7% {
        opacity: .9;
    }

    28% {
        opacity: .45;
    }

    40% {
        opacity: 0;
    }

}

@keyframes achAttentionNotificationPop {
    0%,62%,100% {
        transform: scale(1);
    }

    5% {
        transform: scale(1.105) rotate(-1deg);
    }

    11% {
        transform: scale(.972) rotate(1deg);
    }

    18% {
        transform: scale(1.045);
    }

    27% {
        transform: scale(1);
    }

}

@keyframes achAttentionDot {
    0%,58%,100% {
        opacity: 0;
        transform: scale(.7);
        box-shadow: 0 0 0 0 var(--ach-pulse-rgba);
    }

    7% {
        opacity: 1;
        transform: scale(1.18);
    }

    22% {
        opacity: .9;
        box-shadow: 0 0 0 7px transparent;
        transform: scale(1);
    }

    34% {
        opacity: 0;
    }

}

@keyframes achOnlineBeacon {
    0%,58%,100% {
        box-shadow: 0 0 0 0 color-mix(in srgb,var(--ach-online-color) 65%,transparent);
        transform: scale(1);
    }

    7% {
        box-shadow: 0 0 0 2px color-mix(in srgb,var(--ach-online-color) 34%,transparent);
        transform: scale(1.24);
    }

    22% {
        box-shadow: 0 0 0 7px transparent;
        transform: scale(1);
    }

    34% {
        transform: scale(1.12);
    }

}

@media (prefers-reduced-motion:reduce) {
    .azur-contact-hub.is-attention-active .azur-contact-hub__toggle,.azur-contact-hub.is-attention-active .azur-contact-hub__attention-layer,.azur-contact-hub.is-attention-active .azur-contact-hub__attention-shimmer,.azur-contact-hub.is-attention-active .azur-contact-hub__online-dot {
        animation: none !important;
    }

    .azur-contact-hub.is-attention-active .azur-contact-hub__attention-layer--one {
        opacity: .5 !important;
        border: 2px solid var(--ach-pulse-secondary);
        transform: scale(1.12);
        box-shadow: 0 0 18px var(--ach-pulse-rgba);
    }

}

@media (forced-colors:active) {
    .azur-contact-hub {
        forced-color-adjust: auto;
    }

    .azur-contact-hub__panel,.azur-contact-hub__toggle,.azur-contact-hub__channel,.azur-contact-hub__agent,.azur-contact-hub__header-close {
        border: 1px solid CanvasText;
        box-shadow: none;
    }

    .azur-contact-hub__toggle:focus,.azur-contact-hub__channel:focus,.azur-contact-hub__agent:focus,.azur-contact-hub__header-close:focus {
        forced-color-adjust: none !important;
        border-color: Highlight !important;
        background: ButtonFace !important;
        color: ButtonText !important;
        outline: 3px solid Highlight !important;
        outline-offset: 3px !important;
        box-shadow: none !important;
    }

    .azur-contact-hub__badge {
        border-color: Canvas;
        background: Highlight;
        color: HighlightText;
    }

    .azur-contact-hub__tooltip {
        border: 1px solid CanvasText;
        background: Canvas;
        color: CanvasText;
    }

    .azur-contact-hub__online-dot,.azur-contact-hub__notification-dot {
        background: Highlight;
    }

    .azur-contact-hub__attention {
        display: none !important;
    }

}
