/* Ordenatec AI mascot: layout of the mascot in each AI surface and its short "AI" label.
   Loaded with data-ot-theme-styles: dark colors are explicit below, not derived. */

/* Short "AI" label after a title (set by JS in the interface language). */
[data-ot-ai]::after{content:attr(data-ot-ai);display:inline-block;margin-left:8px;padding:0 7px;border-radius:999px;background:#eef4ff;color:#1554c4;border:1px solid #d6e4ff;font-size:10.5px;font-weight:700;letter-spacing:.03em;line-height:1.6;text-transform:none;vertical-align:.18em;white-space:nowrap}
.report-shell-head .report-ready-label[data-ot-ai]::after{background:#ffffff1a;color:#c9f6ff;border-color:#ffffff38;font-size:9px;vertical-align:0}
.oxd-tools .oxd-ttext>strong[data-ot-ai]::after{font-size:10px;vertical-align:.12em}
.admin-assistant .eyebrow[data-ot-ai]::after{letter-spacing:.03em}

/* Questions to the documentation: one mascot in the header, reflecting the real request state. */
.document-chat .ot-ai-avatar{position:relative;display:inline-flex;line-height:0;--ot-mascot-size:48px}
.ot-ai-seat{display:none}
.document-chat .ot-ai-avatar[data-away]{box-sizing:border-box;width:var(--ot-mascot-size);height:var(--ot-mascot-size);align-items:center;justify-content:center;border-radius:50%;border:2px solid transparent;background:var(--ot-mascot-badge-fill,radial-gradient(circle at 34% 26%,#fff 0,#f1f6ff 46%,#dcebff 100%)) padding-box,linear-gradient(140deg,#8fb2ff,#7fdcd7) border-box}
.document-chat .ot-ai-avatar[data-away]>ot-mascot{display:none}
.document-chat .ot-ai-avatar[data-away]>.ot-ai-seat{display:block;width:62%;height:62%;color:#1f5eff73}
body:not(.ot-document-chat-mobile) .document-chat>header[data-ot-ai-avatar]{display:grid;grid-template-columns:auto minmax(0,1fr);column-gap:14px;align-items:center}
body:not(.ot-document-chat-mobile) .document-chat>header[data-ot-ai-avatar]>*{grid-column:2}
body:not(.ot-document-chat-mobile) .document-chat>header[data-ot-ai-avatar]>.ot-ai-avatar{grid-column:1;grid-row:1/span 4;align-self:center}
body.ot-document-chat-mobile .document-chat .ot-ai-avatar{--ot-mascot-size:32px;flex:none}
.document-chat .messages>p[data-ot-ai-pending]{display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:4px 12px;width:fit-content;max-width:min(92%,640px);box-sizing:border-box;margin:4px 0;padding:10px 16px 10px 10px;border:1px solid #dce6f1;border-radius:18px;background:#f7faff;color:#31445f;line-height:1.45}
.document-chat .messages>p[data-ot-ai-pending]>.ot-ai-inline{display:inline-flex;flex:none;line-height:0;--ot-mascot-size:40px}
body.ot-document-chat-mobile .document-chat .messages>p[data-ot-ai-pending]>.ot-ai-inline{--ot-mascot-size:32px}
.document-chat .ot-ai-slow{grid-column:2;font-size:12.5px;color:#58708a}
.document-chat>p.error .ot-ai-hint{display:block;margin-top:4px;font-weight:400}
body.ot-document-chat-mobile .document-chat>.error:has(.ot-ai-hint){max-height:108px!important}
/* Short screens hide the chat header: the waiting line stays pinned in view while the history scrolls,
   as long as it fits there (data-ot-ai-pin, set by JS). */
body.ot-document-chat-short .document-chat .messages>p[data-ot-ai-pending]{align-items:end;padding-block:6px}
body.ot-document-chat-short .document-chat .messages>p[data-ot-ai-pending][data-ot-ai-pin]{position:sticky;bottom:0;z-index:1;box-shadow:0 -6px 12px #ffffffd9}
body.ot-document-chat-short .document-chat .messages>p[data-ot-ai-pending]>.ot-ai-inline{--ot-mascot-size:28px}
body.ot-document-chat-short .document-chat .messages>p[data-ot-ai-pending]>.ot-ai-pending-text{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* When both lines do not fit, the "still working" line takes the place of the sentence. */
body.ot-document-chat-short .document-chat .messages>p[data-ot-ai-tight]>.ot-ai-pending-text{display:none}
body.ot-document-chat-short .document-chat .messages>p[data-ot-ai-tight]>.ot-ai-slow{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
/* Very short (keyboard open on a small phone): one line of text and a smaller mark. */
body.ot-document-chat-short .document-chat .messages>p[data-ot-ai-compact]{padding-block:2px}
body.ot-document-chat-short .document-chat .messages>p[data-ot-ai-compact]>.ot-ai-inline{--ot-mascot-size:22px}
body.ot-document-chat-short .document-chat .messages>p[data-ot-ai-compact]>:is(.ot-ai-pending-text,.ot-ai-slow){-webkit-line-clamp:1}
/* Not even that fits: blank rather than a cut line (opacity keeps it in the status region). */
body.ot-document-chat-short .document-chat .messages>p[data-ot-ai-nofit]{opacity:0}

/* AI analysis: the mascot reads while the job is pending; no countdown bar or decorative steps. */
.ia-generation-panel[data-ot-ai-gen]>.ia-generation-orbit,.ia-generation-panel[data-ot-ai-gen] .ia-progress-wrap,.ia-generation-panel[data-ot-ai-gen] .ia-generation-steps{display:none!important}
.ia-generation-panel[data-ot-ai-gen]{display:flex!important;align-items:center;gap:20px}
.ia-generation-panel[data-ot-ai-gen]>.ot-ai-gen-face{position:relative;z-index:2;flex:none;line-height:0;--ot-mascot-size:84px}
.ia-generation-panel[data-ot-ai-gen]>.ia-generation-body{flex:1;min-width:0}
:root:not([data-ot-theme="dark"]) .ia-generation-panel[data-ot-ai-gen] .ia-badge{color:#1554c4!important}
:root:not([data-ot-theme="dark"]) .ia-generation-panel[data-ot-ai-gen] .ia-countdown{color:#46607d!important}
.report-title-lockup[data-ot-ai-report]>.report-title-icon{display:none!important}
.report-title-lockup[data-ot-ai-report]>.ot-ai-report-face{flex:none;line-height:0;--ot-mascot-size:56px}
.error-box.resumen-feedback>.ot-ai-alert-face{display:inline-flex;vertical-align:middle;margin-right:10px;line-height:0;--ot-mascot-size:30px}
/* The job's start message stays above a failure: the error explains what happened. */
.summary-notice:has(+ .error-box.resumen-feedback){display:none!important}
@media (max-width:680px){
  .ia-generation-panel[data-ot-ai-gen]{gap:12px;align-items:flex-start}
  .ia-generation-panel[data-ot-ai-gen]>.ot-ai-gen-face{--ot-mascot-size:52px}
  .report-title-lockup[data-ot-ai-report]>.ot-ai-report-face{--ot-mascot-size:44px}
}

/* Administrative assistant: the mascot replaces the document icon of its header. */
.admin-assistant header[data-ot-ai-admin]>.heading-symbol{display:none!important}
.admin-assistant header[data-ot-ai-admin]>.ot-ai-admin-face{flex:none;line-height:0;--ot-mascot-size:64px}
@media (max-width:600px){.admin-assistant header[data-ot-ai-admin]{gap:12px!important}.admin-assistant header[data-ot-ai-admin]>.ot-ai-admin-face{--ot-mascot-size:44px}}
/* The draft viewer is modal: fixed page controls must not sit on its heading or buttons. */
body:has(.viewer-backdrop .document-viewer) .mobile-menu-btn{visibility:hidden!important}

/* Presentations area (administration): the mascot replaces the decorative illustrations. */
section.ai-preparation[data-ot-ai-prep]>.ai-visual:not(.ai-visual--compact),.analysis-flow-stage[data-ot-ai-flow]>.document-flow{display:none!important}
section.ai-preparation[data-ot-ai-prep]>.ot-ai-prep-face{flex:none;line-height:0;--ot-mascot-size:96px}
.analysis-flow-stage[data-ot-ai-flow]>.ot-ai-flow-face{display:grid;place-items:center;line-height:0;--ot-mascot-size:120px}
@media (max-width:680px){section.ai-preparation[data-ot-ai-prep]>.ot-ai-prep-face{--ot-mascot-size:64px}.analysis-flow-stage[data-ot-ai-flow]>.ot-ai-flow-face{--ot-mascot-size:80px}}

/* Alerts: what the AI selection does, next to the option. */
.ot-ai-note,.alert-wizard p.ot-ai-note{display:flex;align-items:flex-start;gap:8px;margin:4px 0 10px;font-size:12.5px;line-height:1.45;color:#58708a;font-weight:400}
.ot-ai-note>ot-mascot{--ot-mascot-size:26px;margin-top:1px}
/* Licis, the alert assistant: its avatar is the mascot, in the round badge of the help launcher. */
.alert-wizard .brand>.avatar[data-ot-ai-licis]{width:auto;height:auto;background:none!important;border-radius:50%;line-height:0;--ot-mascot-size:40px}

/* The floating help keeps the bottom-right corner: the recommendations shortcut sits beside it, not under it. */
#preference-shortcut{right:calc(max(18px,env(safe-area-inset-right)) + 74px)!important}
@media (max-width:600px),(max-height:500px) and (max-width:1000px),(pointer:coarse) and (max-width:1024px){#preference-shortcut{right:calc(max(12px,env(safe-area-inset-right)) + 66px)!important;max-width:calc(100vw - 94px)!important}}

/* Dark appearance: the character keeps its white body; limbs, badges and lines adapt. */
:root[data-ot-theme="dark"]{--ot-mascot-badge-fill:radial-gradient(circle at 34% 26%,#26406b 0,#1d3156 55%,#172846 100%);--ot-mascot-badge-shadow:0 3px 10px #0008;--ot-mascot-limb:#cfe0ff}
:root[data-ot-theme="dark"] [data-ot-ai]::after{background:#1c2f52;color:#a9c6ff;border-color:#2c4775}
:root[data-ot-theme="dark"] .document-chat .messages>p[data-ot-ai-pending]{background:#15233a;border-color:#2a3a55;color:#e6eefb}
:root[data-ot-theme="dark"] body.ot-document-chat-short .document-chat .messages>p[data-ot-ai-pending][data-ot-ai-pin]{box-shadow:0 -6px 12px #101c2dd9}
:root[data-ot-theme="dark"] .document-chat .ot-ai-slow,:root[data-ot-theme="dark"] .ot-ai-note{color:#9fb3cc}
:root[data-ot-theme="dark"] .document-chat .ot-ai-avatar[data-away]>.ot-ai-seat{color:#8fb2ffb3}