.web-shell.ai-workspace-open {
  grid-template:
    "sidebar header assistant" var(--web-header-height)
    "sidebar main assistant" minmax(0, 1fr)
    / var(--web-sidebar-width) minmax(620px, 1fr) 388px;
}

.global-ai-workspace {
  position: sticky;
  top: 0;
  z-index: calc(var(--z-sticky) + 2);
  display: none;
  grid-area: assistant;
  width: 388px;
  height: 100dvh;
  overflow: hidden;
  border-left: 1px solid #d8e2e8;
  background: #fff;
  box-shadow: -10px 0 28px rgb(23 55 79 / 6%);
}

.web-shell.ai-workspace-open .global-ai-workspace { display: block; }

.header-ai-button {
  display: inline-flex;
  min-height: 34px;
  padding: 0 11px;
  align-items: center;
  gap: 7px;
  border: 1px solid #b7dfe0;
  border-radius: 7px;
  color: #087f82;
  background: #f1fbfa;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: background-color .2s ease, border-color .2s ease, color .2s ease;
}

.header-ai-button svg { width: 16px; height: 16px; }
.header-ai-button:hover,
.header-ai-button.is-active { color: #fff; border-color: #079c9c; background: #079c9c; }

.ai-panel { display: flex; height: 100%; min-width: 0; flex-direction: column; color: #173047; background: #fff; }
.ai-panel__header { padding: 18px 18px 0; flex: 0 0 auto; }
.ai-panel__title-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.ai-panel__title-row h2 { margin: 0 0 4px; font-size: 19px; letter-spacing: -.02em; }
.ai-panel__title-row p { max-width: 245px; margin: 0; color: #718494; font-size: 11px; line-height: 1.55; }
.ai-panel__close { flex: 0 0 auto; padding: 7px 9px; border: 1px solid #d7e1e7; border-radius: 6px; color: #496174; background: #fff; cursor: pointer; }
.ai-panel__close:hover { border-color: #91bfc2; color: #087f82; }

.ai-panel__mode-row { display: grid; grid-template-columns: 94px minmax(0, 1fr); gap: 8px; margin-top: 14px; }
.ai-panel__mode,
.ai-panel__scope-select { width: 100%; min-width: 0; height: 36px; padding: 0 8px; border: 1px solid #d3dfe5; border-radius: 6px; color: #29465a; background: #fff; font-size: 12px; }
.ai-panel__context { display: flex; min-width: 0; margin-top: 12px; padding: 10px 0; align-items: center; gap: 7px; border-top: 1px solid #e5ecef; border-bottom: 1px solid #e5ecef; color: #6b7f8f; font-size: 11px; }
.ai-panel__context b { min-width: 0; color: #27455a; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

.ai-panel__body { display: flex; min-height: 0; padding: 18px 18px 8px; flex: 1; overflow-y: auto; flex-direction: column; }
.ai-panel__welcome { margin: auto 0; padding: 8px 4px 34px; text-align: center; }
.ai-panel__avatar { display: grid; width: 56px; height: 56px; margin: 0 auto 14px; place-items: center; border-radius: 17px; color: #087f82; background: #e1f5f2; font-size: 18px; font-weight: 700; }
.ai-panel__welcome h3 { margin: 0 0 7px; font-size: 17px; }
.ai-panel__welcome > p { max-width: 290px; margin: 0 auto; color: #63798a; font-size: 12px; line-height: 1.65; }
.ai-panel__prompts { display: grid; gap: 8px; margin-top: 22px; text-align: left; }
.ai-panel__prompt { display: grid; grid-template-columns: 18px minmax(0,1fr) 12px; min-height: 43px; padding: 10px 11px; align-items: center; gap: 7px; border: 1px solid #d5e1e6; border-radius: 8px; color: #355267; background: #fff; font-size: 12px; text-align: left; cursor: pointer; transition: border-color .18s ease, background-color .18s ease; }
.ai-panel__prompt:hover { border-color: #75bfc0; background: #f6fcfb; }
.ai-panel__prompt i { color: #079c9c; font-style: normal; }
.ai-panel__prompt span:last-child { color: #8ba0ad; }

.ai-panel__stream { display: grid; gap: 10px; }
.ai-message { max-width: 92%; padding: 10px 11px; border-radius: 9px; font-size: 12px; line-height: 1.65; overflow-wrap: anywhere; }
.ai-message--user { margin-left: auto; background: #dcf2ef; }
.ai-message--assistant { background: #f0f4f6; }
.ai-message--loading { color: #718494; }
.ai-result { padding: 12px; border: 1px solid #d9e4e8; border-radius: 9px; background: #fff; }
.ai-result h4 { margin: 0 0 9px; font-size: 13px; }
.ai-result p { margin: 0; font-size: 12px; line-height: 1.65; }
.ai-result__source { margin-top: 8px; padding: 7px 8px; border-radius: 5px; color: #617687; background: #f3f6f8; font-size: 10px; }
.ai-result__kpis { display: grid; grid-template-columns: 1fr 1fr; gap: 7px; }
.ai-result__kpis div { padding: 9px; border-radius: 7px; background: #f2f7f8; font-size: 10px; }
.ai-result__kpis strong { display: block; margin-top: 3px; color: #12314a; font-size: 19px; font-variant-numeric: tabular-nums; }
.ai-result__fields { display: grid; gap: 7px; }
.ai-result__field { display: grid; grid-template-columns: 82px minmax(0,1fr); gap: 7px; padding: 8px; border: 1px solid #e0e8ec; border-radius: 6px; font-size: 11px; }
.ai-result__field span { color: #6d8191; }
.ai-result__field b { min-width: 0; overflow-wrap: anywhere; }
.ai-result__action { width: 100%; margin-top: 10px; padding: 9px 10px; border: 0; border-radius: 6px; color: #fff; background: #079c9c; font-size: 12px; font-weight: 600; cursor: pointer; }
.ai-result__action:hover { background: #087f82; }

.ai-upload { display: grid; min-height: 150px; margin-top: 20px; padding: 18px; place-items: center; border: 1px dashed #95bec3; border-radius: 9px; color: #607687; background: #f8fbfc; cursor: pointer; text-align: center; }
.ai-upload strong { display: block; margin-bottom: 6px; color: #187f82; }
.ai-upload small { display: block; line-height: 1.6; }
.ai-upload input { display: none; }

.ai-panel__composer { flex: 0 0 auto; margin: 0 18px 16px; padding: 9px; border: 1px solid #cddbe2; border-radius: 10px; background: #fff; box-shadow: 0 -8px 22px rgb(255 255 255 / 92%); }
.ai-panel__composer textarea { width: 100%; height: 56px; padding: 2px; resize: none; border: 0; outline: 0; color: #1e3a4e; background: transparent; font: inherit; font-size: 12px; }
.ai-panel__composer-tools { display: flex; align-items: center; gap: 7px; }
.ai-panel__composer-tools button { padding: 5px; border: 0; color: #50697b; background: transparent; font-size: 10px; cursor: pointer; }
.ai-panel__send { display: grid !important; width: 34px; height: 34px; margin-left: auto; padding: 0 !important; place-items: center; border-radius: 8px !important; color: #fff !important; background: #079c9c !important; font-size: 16px !important; }
.ai-panel__note { margin: -8px 18px 11px; color: #94a2ac; font-size: 9px; text-align: center; }
.ai-panel__receipt { text-align: center; }
.ai-panel__receipt-mark { display: grid; width: 52px; height: 52px; margin: 14px auto 10px; place-items: center; border: 6px solid #edf9f5; border-radius: 50%; color: #168e65; background: #ddf4e9; font-size: 24px; }
.ai-panel__receipt h3 { margin: 0 0 5px; font-size: 16px; }
.ai-panel__receipt > p { color: #718494; font-size: 12px; }
.ai-panel__receipt dl { margin: 15px 0 0; padding: 11px; border: 1px solid #dbe5e9; border-radius: 8px; text-align: left; }
.ai-panel__receipt dl div { display: grid; grid-template-columns: 78px minmax(0,1fr); gap: 8px; padding: 7px 0; border-bottom: 1px solid #edf1f3; font-size: 11px; }
.ai-panel__receipt dl div:last-child { border-bottom: 0; }
.ai-panel__receipt dt { color: #708393; }
.ai-panel__receipt dd { margin: 0; overflow-wrap: anywhere; }

.workbench-ai-entry button[data-action="open-ai-workspace"] { width: 100%; }

@media (max-width: 1480px) {
  .global-ai-workspace { position: fixed; right: 0; box-shadow: -16px 0 36px rgb(15 45 69 / 15%); }
  .web-shell.ai-workspace-open { grid-template: "sidebar header" var(--web-header-height) "sidebar main" minmax(0,1fr) / var(--web-sidebar-width) minmax(0,1fr); }
}

@media (max-width: 1199px) {
  .web-shell.ai-workspace-open { grid-template-columns: var(--web-sidebar-collapsed-width) minmax(0,1fr); }
}
/* Keep the current operation usable beside the assistant. */
body.business-ai-open .global-ai-workspace{position:fixed;top:0;right:0;z-index:3000;width:388px}
body.business-ai-open .el-overlay{right:388px;padding:20px}
body.business-ai-open .el-overlay .el-dialog{max-width:calc(100vw - 428px)}
.el-layer__header>[data-operation-ai]{margin-left:auto;flex:none}
.ai-panel__welcome{margin:0;padding:8px 0 20px;text-align:left}
.ai-panel__mode-row{display:flex;justify-content:space-between}
.ai-capability-list{display:grid;gap:8px;margin-top:16px}
.ai-capability-list .ai-panel__prompt{display:flex;flex-direction:column;align-items:flex-start}
.ai-capability-list small{color:var(--el-text-color-secondary);font-size:12px}
.ai-result__field small{display:block;margin:6px 0;color:var(--el-text-color-secondary)}
.ai-panel__attachment{cursor:pointer;white-space:nowrap;font-size:12px;color:#087f82}
.ai-panel__attachment input{display:none}
.ai-panel__composer-tools>span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;color:#718494}
.ai-result>.ai-panel__attachment{display:block;margin-top:12px}
.ai-panel__header [data-ai-action],.ai-result button{font-family:inherit}
@media(max-width:1000px){body.business-ai-open .global-ai-workspace{width:340px}body.business-ai-open .el-overlay{right:340px;padding:12px}body.business-ai-open .el-overlay .el-dialog{max-width:calc(100vw - 364px)}}
body.business-ai-open .mat-v6-modal-backdrop{right:388px}
@media(max-width:1000px){body.business-ai-open .mat-v6-modal-backdrop{right:340px}}
.web-ai-floating{position:fixed;z-index:3100;width:94px;height:126px;padding:0;border:0;background:transparent;box-shadow:none;cursor:grab;touch-action:none;user-select:none}
.web-ai-floating img{position:absolute;right:3px;bottom:0;width:78px;height:100px;object-fit:contain;object-position:center bottom;filter:drop-shadow(0 8px 10px rgb(22 68 108 / 20%));pointer-events:none}
.web-ai-floating__hello{position:absolute;top:3px;left:4px;padding:4px 7px;border:1px solid #cfe6f8;border-radius:10px 10px 2px 10px;color:#165e97;background:#fff;box-shadow:0 5px 14px rgb(22 68 108 / 12%);font-size:10px;font-weight:600;pointer-events:none}
.web-ai-floating__cta{position:absolute;right:8px;bottom:0;display:grid;place-items:center;width:58px;min-height:30px;border-radius:999px;color:white;background:#187ed4;box-shadow:0 6px 14px rgb(24 105 170 / 20%);font-size:11px;font-weight:700;pointer-events:none}
.web-ai-floating:active{cursor:grabbing}
body.business-ai-open .web-ai-floating{display:none}
.ai-panel__mode-row .ai-panel__mode{width:140px}
body.business-ai-open .el-overlay{right:0;padding-right:408px}
body.business-ai-open .mat-v6-modal-backdrop{right:0;padding-right:408px}
@media(max-width:1000px){body.business-ai-open .el-overlay,body.business-ai-open .mat-v6-modal-backdrop{right:0;padding-right:352px}}
body.business-ai-open .el-overlay{inset:0;padding:20px!important}
body.business-ai-open .el-overlay .el-dialog{margin-right:388px!important;max-width:calc(100vw - 428px)!important}
@media(max-width:1000px){body.business-ai-open .el-overlay .el-dialog{margin-right:340px!important;max-width:calc(100vw - 380px)!important}}
.web-ai-floating{transform:translateX(76px);transition:transform 260ms ease}
.web-ai-floating[data-edge="left"]{transform:translateX(-76px)}
.web-ai-floating:hover,.web-ai-floating:focus-visible,.web-ai-floating.is-dragging{transform:translateX(0)}
.web-ai-floating__handle{position:absolute;top:35px;left:0;display:grid;place-items:center;width:20px;height:42px;border:1px solid #b7daf6;border-right:0;border-radius:14px 0 0 14px;color:#176eaf;background:#eaf6ff;box-shadow:-3px 4px 12px rgb(29 80 121 / 12%);font-size:22px}
.web-ai-floating[data-edge="left"] .web-ai-floating__handle{left:auto;right:0;transform:rotate(180deg)}
.web-ai-floating__hello,.web-ai-floating__cta{opacity:0;transition:opacity 180ms ease}
.web-ai-floating:hover .web-ai-floating__hello,.web-ai-floating:hover .web-ai-floating__cta,.web-ai-floating:focus-visible .web-ai-floating__hello,.web-ai-floating:focus-visible .web-ai-floating__cta{opacity:1}
.web-ai-floating:hover .web-ai-floating__handle,.web-ai-floating:focus-visible .web-ai-floating__handle,.web-ai-floating.is-dragging .web-ai-floating__handle{opacity:0}
.web-ai-floating.is-dragging{transition:none}
@media(prefers-reduced-motion:reduce){.web-ai-floating,.web-ai-floating__hello,.web-ai-floating__cta{transition:none}}
.ai-mode-workspace{padding:20px 0;color:var(--text-primary,#183650)}
.ai-mode-workspace h3{font-size:16px;margin:0 0 12px}
.ai-mode-workspace p{font-size:13px;color:var(--text-secondary,#7890a8);line-height:1.7}
.ai-mode-upload{border:1px dashed #cbdde7;border-radius:8px;background:#f6fafc;padding:24px 16px;display:flex;flex-direction:column;gap:12px;margin:18px 0}
.ai-mode-upload span{font-size:12px;overflow-wrap:anywhere;color:#7890a8}
.ai-mode-workspace label:has(textarea){display:block;font-size:13px;margin-bottom:16px}
.ai-mode-workspace textarea{display:block;box-sizing:border-box;width:100%;margin-top:8px;padding:10px;border:1px solid #cbdde7;border-radius:8px;font:inherit;resize:vertical}
