/* OIE Assistant widget — self-contained, package-served (the ops.css
   mechanism). Every selector is prefixed .oie-asst- so nothing can collide
   with the storefront theme. No import rule, no external hosts.

   TASK-19 REVIEW FINDING (brief defect, flagged — see task-19-report.md):
   the brief's own literal comment text here named the CSS at-rule that
   pulls in an external stylesheet, spelled out in full as an "at" sign
   directly followed by its keyword — the exact needle this file's own
   WidgetAssetsTest::test_the_stylesheet_is_self_contained() asserts must
   NOT appear anywhere in this file, so the brief's two pieces contradicted
   each other and the file could not pass its own mandated test unedited.
   Reworded above to say the same thing without spelling out that token;
   no rule, selector, or declaration changed. */
.oie-asst-launcher {
    position: fixed;
    right: 20px;
    bottom: calc(20px + var(--oie-asst-lift, 0px));
    z-index: 9998;
    border: 0;
    border-radius: 999px;
    padding: 12px 20px;
    background: #6b2d5b;
    color: #fff;
    font: 600 15px/1.2 "Segoe UI", Tahoma, Arial, sans-serif;
    cursor: pointer;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25);
}
.oie-asst-launcher:hover { background: #55234a; }
.oie-asst-launcher-icon { display: none; }
@media (max-width: 767.98px) {
    .oie-asst-launcher {
        padding: 0;
        width: 48px;
        height: 48px;
        right: 12px;
        bottom: calc(12px + var(--oie-asst-lift, 0px));
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .oie-asst-launcher-icon { display: block; }
    .oie-asst-launcher-text {
        position: absolute;
        width: 1px;
        height: 1px;
        margin: -1px;
        overflow: hidden;
        clip: rect(0, 0, 0, 0);
        white-space: nowrap;
        border: 0;
    }
    .oie-asst-panel { bottom: calc(72px + var(--oie-asst-lift, 0px)); }
    #oie-assistant-root[data-placement="learning"] .oie-asst-launcher { display: none; }
    [dir="rtl"] .oie-asst-launcher, .rtl .oie-asst-launcher { right: auto; left: 12px; }
    /* UX-1 fix wave (T7): the panel opens on the launcher's side in RTL too. */
    [dir="rtl"] .oie-asst-panel, .rtl .oie-asst-panel { right: auto; left: 12px; }
}
.oie-asst-panel {
    position: fixed;
    right: 20px;
    bottom: 76px;
    z-index: 9999;
    width: 340px;
    max-width: calc(100vw - 40px);
    max-height: 70vh;
    display: none;
    flex-direction: column;
    background: #fff;
    border: 1px solid #e2d9e0;
    border-radius: 14px;
    overflow: hidden;
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.28);
    font: 14px/1.45 "Segoe UI", Tahoma, Arial, sans-serif;
    color: #2b2230;
}
.oie-asst-panel.oie-asst-open { display: flex; }
.oie-asst-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    background: #6b2d5b;
    color: #fff;
    font-weight: 600;
}
.oie-asst-close {
    border: 0;
    background: transparent;
    color: #fff;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
}
.oie-asst-messages {
    flex: 1;
    overflow-y: auto;
    padding: 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-height: 120px;
}
.oie-asst-msg {
    max-width: 85%;
    padding: 8px 12px;
    border-radius: 10px;
    white-space: pre-wrap;
    word-wrap: break-word;
}
.oie-asst-msg--visitor {
    align-self: flex-end;
    background: #6b2d5b;
    color: #fff;
}
.oie-asst-msg--assistant {
    align-self: flex-start;
    background: #f3edf2;
}
.oie-asst-msg--error {
    align-self: flex-start;
    background: #fbeaea;
    color: #8a2323;
}
.oie-asst-chatform,
.oie-asst-leadform {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 10px 12px;
    border-top: 1px solid #eee3ec;
}
.oie-asst-chatrow { display: flex; gap: 8px; }
.oie-asst-input,
.oie-asst-leadform input,
.oie-asst-leadform textarea {
    width: 100%;
    padding: 8px 10px;
    border: 1px solid #d8cbd5;
    border-radius: 8px;
    font: inherit;
}
.oie-asst-send,
.oie-asst-leadsubmit {
    border: 0;
    border-radius: 8px;
    padding: 8px 14px;
    background: #6b2d5b;
    color: #fff;
    font-weight: 600;
    cursor: pointer;
}
.oie-asst-send:disabled,
.oie-asst-leadsubmit:disabled { opacity: 0.5; cursor: default; }
/* R19 Task 9 (ruling 13): the quick-reply chip strip, directly above the
   message box. Same palette as the panel's own controls — this file
   declares no custom properties, so the colours are its existing
   literals. */
.oie-asst-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 0 12px 10px;
}
.oie-asst-chip {
    border: 1px solid #d8cbd5;
    border-radius: 999px;
    padding: 6px 12px;
    background: #fff;
    color: #6b2d5b;
    font: 600 13px/1.2 "Segoe UI", Tahoma, Arial, sans-serif;
    cursor: pointer;
    text-align: left;
}
.oie-asst-chip:hover {
    border-color: #6b2d5b;
    background: #f3edf2;
}
.oie-asst-teamlink {
    border: 0;
    background: transparent;
    color: #6b2d5b;
    font-weight: 600;
    text-decoration: underline;
    cursor: pointer;
    align-self: flex-start;
    padding: 0 12px 10px;
}
.oie-asst-leadform { display: none; }
.oie-asst-leadform.oie-asst-open { display: flex; }
.oie-asst-hp {
    position: absolute;
    left: -9999px;
    top: -9999px;
    height: 1px;
    width: 1px;
    opacity: 0;
}
