/* /Components/Layout/MainLayout.razor.rz.scp.css */
/* The framework error bar inherits the dark theme's light ink by default, which was invisible on
   the light-yellow background — colors here must stay explicit so it reads on any page. */
#blazor-error-ui[b-t4670b9dd8] {
    background: #b91c1c;
    color: #fff;
    font-size: 1rem;
    font-weight: 600;
    bottom: 0;
    box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.45);
    box-sizing: border-box;
    display: none;
    left: 0;
    padding: 0.85rem 3rem 0.9rem 1.25rem;
    position: fixed;
    width: 100%;
    z-index: 1000;
}

    #blazor-error-ui .reload[b-t4670b9dd8] {
        color: #fff;
        font-weight: 700;
        text-decoration: underline;
        margin-left: 0.5rem;
    }

    #blazor-error-ui .dismiss[b-t4670b9dd8] {
        color: #fff;
        font-size: 1.1rem;
        cursor: pointer;
        position: absolute;
        right: 0.9rem;
        top: 0.7rem;
    }
/* /Components/Layout/ReconnectModal.razor.rz.scp.css */
.components-reconnect-first-attempt-visible[b-cmh2psw6dj],
.components-reconnect-repeated-attempt-visible[b-cmh2psw6dj],
.components-reconnect-failed-visible[b-cmh2psw6dj],
.components-pause-visible[b-cmh2psw6dj],
.components-resume-failed-visible[b-cmh2psw6dj],
.components-rejoining-animation[b-cmh2psw6dj] {
    display: none;
}

#components-reconnect-modal.components-reconnect-show .components-reconnect-first-attempt-visible[b-cmh2psw6dj],
#components-reconnect-modal.components-reconnect-show .components-rejoining-animation[b-cmh2psw6dj],
#components-reconnect-modal.components-reconnect-paused .components-pause-visible[b-cmh2psw6dj],
#components-reconnect-modal.components-reconnect-resume-failed .components-resume-failed-visible[b-cmh2psw6dj],
#components-reconnect-modal.components-reconnect-retrying[b-cmh2psw6dj],
#components-reconnect-modal.components-reconnect-retrying .components-reconnect-repeated-attempt-visible[b-cmh2psw6dj],
#components-reconnect-modal.components-reconnect-retrying .components-rejoining-animation[b-cmh2psw6dj],
#components-reconnect-modal.components-reconnect-failed[b-cmh2psw6dj],
#components-reconnect-modal.components-reconnect-failed .components-reconnect-failed-visible[b-cmh2psw6dj] {
    display: block;
}


#components-reconnect-modal[b-cmh2psw6dj] {
    background-color: white;
    width: 20rem;
    margin: 20vh auto;
    padding: 2rem;
    border: 0;
    border-radius: 0.5rem;
    box-shadow: 0 3px 6px 2px rgba(0, 0, 0, 0.3);
    opacity: 0;
    transition: display 0.5s allow-discrete, overlay 0.5s allow-discrete;
    animation: components-reconnect-modal-fadeOutOpacity-b-cmh2psw6dj 0.5s both;
    &[open]

{
    animation: components-reconnect-modal-slideUp-b-cmh2psw6dj 1.5s cubic-bezier(.05, .89, .25, 1.02) 0.3s, components-reconnect-modal-fadeInOpacity-b-cmh2psw6dj 0.5s ease-in-out 0.3s;
    animation-fill-mode: both;
}

}

#components-reconnect-modal[b-cmh2psw6dj]::backdrop {
    background-color: rgba(0, 0, 0, 0.4);
    animation: components-reconnect-modal-fadeInOpacity-b-cmh2psw6dj 0.5s ease-in-out;
    opacity: 1;
}

@keyframes components-reconnect-modal-slideUp-b-cmh2psw6dj {
    0% {
        transform: translateY(30px) scale(0.95);
    }

    100% {
        transform: translateY(0);
    }
}

@keyframes components-reconnect-modal-fadeInOpacity-b-cmh2psw6dj {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes components-reconnect-modal-fadeOutOpacity-b-cmh2psw6dj {
    0% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}

.components-reconnect-container[b-cmh2psw6dj] {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1rem;
}

#components-reconnect-modal p[b-cmh2psw6dj] {
    margin: 0;
    text-align: center;
}

#components-reconnect-modal button[b-cmh2psw6dj] {
    border: 0;
    background-color: #6b9ed2;
    color: white;
    padding: 4px 24px;
    border-radius: 4px;
}

    #components-reconnect-modal button:hover[b-cmh2psw6dj] {
        background-color: #3b6ea2;
    }

    #components-reconnect-modal button:active[b-cmh2psw6dj] {
        background-color: #6b9ed2;
    }

.components-rejoining-animation[b-cmh2psw6dj] {
    position: relative;
    width: 80px;
    height: 80px;
}

    .components-rejoining-animation div[b-cmh2psw6dj] {
        position: absolute;
        border: 3px solid #0087ff;
        opacity: 1;
        border-radius: 50%;
        animation: components-rejoining-animation-b-cmh2psw6dj 1.5s cubic-bezier(0, 0.2, 0.8, 1) infinite;
    }

        .components-rejoining-animation div:nth-child(2)[b-cmh2psw6dj] {
            animation-delay: -0.5s;
        }

@keyframes components-rejoining-animation-b-cmh2psw6dj {
    0% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    4.9% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 0;
    }

    5% {
        top: 40px;
        left: 40px;
        width: 0;
        height: 0;
        opacity: 1;
    }

    100% {
        top: 0px;
        left: 0px;
        width: 80px;
        height: 80px;
        opacity: 0;
    }
}
/* /Components/Shared/CallKeypad.razor.rz.scp.css */
/* ⌨ In-window call keypad (2026-09-16). Token-only, so it follows every html.theme-* theme with no per-theme block.
   Mirrors the topbar keypad (.softphone .sp-keypad in brutus-theme.css) so the two look the same. */
.ck[b-eacjyiuy7i] { position: relative; display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.ck-toggle.on[b-eacjyiuy7i] { border-color: var(--cyan-bright); color: var(--ink); }
.ck-pop[b-eacjyiuy7i] { position: absolute; top: calc(100% + 8px); right: 0; z-index: 3000; padding: 10px; background: var(--panel);
  border: 1px solid var(--line); border-radius: 10px; box-shadow: var(--shadow-glow); }
.ck-pop.left[b-eacjyiuy7i] { right: auto; left: 0; }
.ck-head[b-eacjyiuy7i] { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 8px; font-size: .8rem; white-space: nowrap; }
.ck-grid[b-eacjyiuy7i] { display: grid; grid-template-columns: repeat(3, 46px); gap: 6px; }
.ck-grid .btn-call[b-eacjyiuy7i] { min-width: 0; padding: 6px 0 4px; text-align: center; display: flex; flex-direction: column; align-items: center; line-height: 1.1; }
.ck-d[b-eacjyiuy7i] { font-size: 1.05rem; font-weight: 600; }
.ck-l[b-eacjyiuy7i] { font-size: .55rem; letter-spacing: .08em; color: var(--muted); min-height: .7em; }
/* /Components/Shared/UnitNamesInput.razor.rz.scp.css */
/* Per-unit name boxes (feedback #394, 2026-09-16). Token-only, so it follows every html.theme-* theme.
   flex-basis:100% puts it on its own row inside a wrapping flex line (the Workspace .sale-line). */
.un-wrap[b-dcx0lw8sxl] { display: grid; grid-template-columns: auto minmax(140px, 1fr); gap: 4px 8px; align-items: center;
  flex-basis: 100%; min-width: 220px; margin-top: 2px; }
.un-head[b-dcx0lw8sxl] { grid-column: 1 / -1; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; font-size: .82rem; }
.un-count[b-dcx0lw8sxl] { color: var(--red-soft, #e5484d); font-size: .78rem; margin-left: auto; white-space: nowrap; }
.un-count.done[b-dcx0lw8sxl] { color: var(--muted); }
.un-no[b-dcx0lw8sxl] { font-size: .78rem; color: var(--muted); white-space: nowrap; }
.un-box[b-dcx0lw8sxl] { grid-column: 2; width: 100%; min-width: 0; box-sizing: border-box; background: var(--bg-2); color: var(--ink);
  border: 1px solid var(--line-2); border-radius: var(--radius-sm); padding: 5px 8px; font: inherit; font-size: .88rem; }
.un-box.solo[b-dcx0lw8sxl] { grid-column: 1 / -1; }
.un-box:focus[b-dcx0lw8sxl] { outline: none; border-color: var(--cyan); }
.un-box:disabled[b-dcx0lw8sxl] { opacity: .55; }
.un-note[b-dcx0lw8sxl] { grid-column: 1 / -1; font-size: .78rem; color: var(--muted); }
/* /Components/Shared/VoiceScriptBuilder.razor.rz.scp.css */
/* 🧩 Voice-agent script builder (2026-10-19). Theme tokens only, so it reads in every html.theme-* theme. */
/* Sized to the space it actually gets (container queries), not the window: on /voiceagents it sits beside the nav
   and the script list, so a 1280-1440px screen leaves it ~600-900px (review 2026-10-19). */
.vsb[b-havz8zbyir] { display: flex; flex-direction: column; gap: 10px; container-type: inline-size; }
.vsb-bar[b-havz8zbyir] { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.vsb-inline[b-havz8zbyir] { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-size: .85rem; }
.vsb-inline select[b-havz8zbyir] { background: var(--panel-2); color: var(--ink); border: 1px solid var(--line-2); border-radius: 8px; padding: 5px 8px; }
.vsb-count[b-havz8zbyir] { font-size: .85rem; }
.vsb-gap[b-havz8zbyir] { flex: 1; }
.vsb-warn[b-havz8zbyir] { background: rgba(232,65,47,.08); border: 1px solid rgba(232,65,47,.35); color: var(--ink); border-radius: 8px; padding: 6px 10px; font-size: .88rem; }
.vsb-problems[b-havz8zbyir] { border: 1px solid rgba(232,65,47,.45); border-radius: 10px; padding: 8px 10px; background: rgba(232,65,47,.06); color: var(--ink); }
.vsb-problems b[b-havz8zbyir] { display: block; margin-bottom: 4px; color: var(--red-soft); }
.vsb-ok[b-havz8zbyir] { border: 1px solid rgba(80,220,140,.4); border-radius: 10px; padding: 6px 10px; color: var(--ink); background: rgba(80,220,140,.06); font-size: .9rem; }
.vsb-prob[b-havz8zbyir] { cursor: pointer; font-size: .88rem; padding: 2px 0; }
.vsb-prob:hover[b-havz8zbyir] { text-decoration: underline; }
.vsb-prob.note[b-havz8zbyir] { color: var(--muted); }
.vsb-notes[b-havz8zbyir] { font-size: .88rem; }
.vsb-notes summary[b-havz8zbyir] { cursor: pointer; color: var(--muted); }
.vsb-notes-help[b-havz8zbyir] { margin: 4px 0 6px; font-size: .82rem; }
.vsb-split[b-havz8zbyir] { display: flex; gap: 14px; align-items: flex-start; }
.vsb-steps[b-havz8zbyir] { flex: 0 0 240px; max-height: 70vh; overflow-y: auto; display: flex; flex-direction: column; gap: 4px; }
.vsb-step[b-havz8zbyir] { border: 1px solid var(--line); border-radius: 8px; padding: 6px 8px; cursor: pointer; background: var(--panel-2); color: var(--ink); }
.vsb-step:hover[b-havz8zbyir] { border-color: var(--line-2); }
.vsb-step.sel[b-havz8zbyir] { border-color: var(--cyan-bright); box-shadow: 0 0 0 1px var(--cyan-bright); }
.vsb-step-top[b-havz8zbyir] { display: flex; align-items: center; gap: 6px; }
.vsb-num[b-havz8zbyir] { flex: 0 0 auto; min-width: 22px; height: 22px; border-radius: 11px; display: inline-flex; align-items: center; justify-content: center;
  font-size: .75rem; font-weight: 700; background: var(--panel); border: 1px solid var(--line-2); color: var(--ink); }
.vsb-id[b-havz8zbyir] { font-weight: 600; font-family: ui-monospace, Consolas, monospace; font-size: .85rem; overflow-wrap: anywhere; }
.vsb-step .chip[b-havz8zbyir] { margin-left: 0; }
.vsb-snip[b-havz8zbyir] { font-size: .8rem; margin-top: 2px; overflow-wrap: anywhere; }
.vsb-detail[b-havz8zbyir] { flex: 1; min-width: 0; container-type: inline-size; }
.vsb-info[b-havz8zbyir] { border: 1px solid var(--line-2); background: var(--panel-2); color: var(--ink); border-radius: 8px; padding: 6px 10px; font-size: .88rem; }
.vsb-okline[b-havz8zbyir] { color: var(--ink); font-size: .82rem; opacity: .85; }
.vsb-detail textarea[b-havz8zbyir] { width: 100%; }
.vsb-row[b-havz8zbyir] { display: flex; gap: 8px; align-items: center; }
.vsb-row input[b-havz8zbyir] { flex: 1; }
.vsb-h[b-havz8zbyir] { margin: 14px 0 6px; font-size: .95rem; }
.vsb-h .muted[b-havz8zbyir] { font-weight: 400; font-size: .8rem; }
.vsb-rules[b-havz8zbyir] { display: flex; flex-direction: column; gap: 6px; }
.vsb-rule[b-havz8zbyir] { display: grid; grid-template-columns: minmax(150px, 1.1fr) 92px minmax(0, 2.4fr) 30px; gap: 6px; align-items: start;
  border-bottom: 1px dashed var(--line); padding-bottom: 6px; }
.vsb-rule input[b-havz8zbyir], .vsb-rule select[b-havz8zbyir], .vsb-rule textarea[b-havz8zbyir], .vsb-add input[b-havz8zbyir], .vsb-add select[b-havz8zbyir] {
  width: 100%; background: var(--panel-2); color: var(--ink); border: 1px solid var(--line-2); border-radius: 7px; padding: 5px 7px; font-size: .88rem; }
.vsb-key[b-havz8zbyir] { font-family: ui-monospace, Consolas, monospace; }
.vsb-num-in[b-havz8zbyir] { max-width: 140px; }
.vsb-json[b-havz8zbyir] { font-family: ui-monospace, Consolas, monospace; font-size: .8rem; }
.vsb-val[b-havz8zbyir] { min-width: 0; display: flex; flex-direction: column; gap: 4px; }
.vsb-val > .btn-call[b-havz8zbyir] { align-self: flex-start; }
.vsb-bad[b-havz8zbyir] { color: var(--red-soft); font-size: .82rem; }
.vsb-x[b-havz8zbyir] { padding: 4px 6px; }
.vsb-add[b-havz8zbyir] { display: grid; grid-template-columns: minmax(150px, 1.1fr) 92px auto; gap: 6px; margin-top: 8px; }
.vsb-extra[b-havz8zbyir] { font-size: .82rem; margin-top: 8px; }
.vsb-empty[b-havz8zbyir] { padding: 10px 0; }
@container (max-width: 760px) {
  .vsb-split[b-havz8zbyir] { flex-direction: column; }
  .vsb-steps[b-havz8zbyir] { flex: none; width: 100%; max-height: 260px; }
}
@container (max-width: 560px) {
  .vsb-rule[b-havz8zbyir] { grid-template-columns: 1fr 92px 30px; }
  .vsb-rule .vsb-val[b-havz8zbyir] { grid-column: 1 / -1; grid-row: 2; }
  .vsb-rule .vsb-x[b-havz8zbyir] { grid-row: 1; grid-column: 3; }
  .vsb-add[b-havz8zbyir] { grid-template-columns: 1fr 92px; }
  .vsb-add .btn-call[b-havz8zbyir] { grid-column: 1 / -1; }
}