/* AMPOL V26.2 — hosted visual audit fixes (desktop + mobile + all themes). */

/* The assistant must occupy only its launcher, never a full-width invisible layer. */
.ampol-faq-bot {
    width: max-content !important;
    max-width: calc(100vw - 24px) !important;
}
.ampol-faq-bot__launcher {
    isolation: isolate;
    background: transparent !important;
    box-shadow: none !important;
}
.ampol-faq-bot__character.is-theme-operator > img {
    position: absolute !important;
    inset: 4px !important;
    display: block !important;
    width: 68px !important;
    height: 68px !important;
    max-width: 68px !important;
    border-radius: 50% !important;
    background: transparent !important;
    object-fit: cover !important;
}

/* Six clearly different PLUS surfaces; copy stays readable in every theme. */
html[data-theme="emerald"] { --plus-surface-a:#071d1a; --plus-surface-b:#12273b; --plus-glow:#2dd4a6; }
html[data-theme="crimson"] { --plus-surface-a:#32131c; --plus-surface-b:#5b2230; --plus-glow:#fb7185; }
html[data-theme="sapphire"] { --plus-surface-a:#071a35; --plus-surface-b:#123c70; --plus-glow:#60a5fa; }
html[data-theme="graphite"] { --plus-surface-a:#0c1118; --plus-surface-b:#242b36; --plus-glow:#94a3b8; }
html[data-theme="violet"] { --plus-surface-a:#171035; --plus-surface-b:#322064; --plus-glow:#a78bfa; }
html[data-theme="solar"] { --plus-surface-a:#241a05; --plus-surface-b:#5b3f08; --plus-glow:#facc15; }
body.ampol-app.is-dashboard-route .dashboard-plus {
    border-color: color-mix(in srgb,var(--plus-glow) 48%,transparent) !important;
    background:
        radial-gradient(circle at 10% 0,color-mix(in srgb,var(--plus-glow) 30%,transparent),transparent 35%),
        linear-gradient(135deg,var(--plus-surface-a),var(--plus-surface-b)) !important;
    box-shadow: 0 24px 65px color-mix(in srgb,var(--plus-glow) 14%,transparent) !important;
}
body.ampol-app.is-dashboard-route .dashboard-plus :is(h2,p,b,span,small) { opacity:1; }
body.ampol-app.is-dashboard-route .dashboard-plus__copy p,
body.ampol-app.is-dashboard-route .dashboard-plus__status small,
body.ampol-app.is-dashboard-route .dashboard-plus__usage span { color:#cbd5e1 !important; }
body.ampol-app.is-dashboard-route .dashboard-plus__chips span { color:#f8fafc !important; }
.plus-v23-pass-tech span { color:rgba(255,255,255,.46) !important; font-size:7px !important; }

/* App-like support chat: viewport shell, inner message scroll and docked composer. */
.ampol-ticket-chat {
    display:flex !important;
    height:clamp(600px,calc(100dvh - 190px),780px) !important;
    min-height:0 !important;
    flex-direction:column !important;
    overflow:hidden !important;
}
.ampol-ticket-chat__head { flex:0 0 auto !important; }
.ampol-ticket-chat__stream {
    flex:1 1 auto !important;
    min-height:0 !important;
    overflow-x:hidden !important;
    overflow-y:auto !important;
    overscroll-behavior:contain;
    scrollbar-width:thin;
}
.ampol-ticket-chat > .ampol-ticket-composer { flex:0 0 auto !important; }
.ampol-ticket-bubble,
.ampol-ticket-bubble :is(p,small,b,strong,span),
.ampol-ticket-message-copy { opacity:1 !important; }
.ampol-ticket-bubble.is-user {
    border-color:color-mix(in srgb,var(--theme-text) 14%,transparent) !important;
    background:color-mix(in srgb,var(--theme-panel-soft) 94%,var(--v12-accent) 6%) !important;
    color:var(--theme-text) !important;
}
.ampol-ticket-bubble.is-user .ampol-ticket-message-copy,
.ampol-ticket-bubble.is-user p { color:var(--theme-text) !important; text-shadow:none !important; }
.ampol-ticket-bubble header :is(p,small) { color:var(--theme-muted) !important; }
.ampol-support-code__number { color:var(--theme-bg) !important; opacity:1 !important; letter-spacing:.16em !important; }

/* Discoverable, controllable rails instead of apparently missing cards. */
.ampol-team-controls { display:flex; align-items:center; gap:.45rem; color:var(--v12-muted); }
.ampol-team-controls span { margin-inline-end:.35rem; font-size:.68rem; }
.ampol-team-controls button {
    display:grid;
    width:2.35rem;
    height:2.35rem;
    place-items:center;
    border:1px solid var(--v12-line-strong);
    border-radius:.8rem;
    background:var(--v12-panel);
    color:var(--v12-text);
    font-size:1.25rem;
}
.store-mobile-swipe-hint { display:none; }

@media (max-width:760px) {
    body.ampol-app { padding-bottom:calc(96px + env(safe-area-inset-bottom)); }
    .ampol-faq-bot {
        inset-inline-start:auto !important;
        inset-inline-end:14px !important;
        bottom:calc(96px + env(safe-area-inset-bottom)) !important;
    }
    .ampol-faq-bot__launcher { width:64px !important; height:64px !important; }
    .ampol-faq-bot__character.is-theme-operator { width:64px !important; height:64px !important; }
    .ampol-faq-bot__character.is-theme-operator > img {
        inset:4px !important;
        width:56px !important;
        height:56px !important;
        max-width:56px !important;
    }
    .ampol-faq-chat {
        position:fixed !important;
        inset:10px 8px calc(92px + env(safe-area-inset-bottom)) !important;
        width:auto !important;
        max-width:none !important;
        height:auto !important;
        max-height:none !important;
    }
    .mobile-app-nav { bottom:calc(7px + env(safe-area-inset-bottom)) !important; }

    .account-hero { padding:1rem !important; border-radius:1.35rem !important; }
    .account-hero h1 { margin-top:.8rem !important; font-size:1.65rem !important; line-height:1.55 !important; }
    .account-hero h1 + p { margin-top:.65rem !important; font-size:.75rem !important; line-height:1.9 !important; }
    .account-hero .btn-primary,.account-hero .btn-secondary { min-height:42px !important; padding:.65rem .8rem !important; font-size:.68rem !important; }
    body.ampol-app.is-dashboard-route .dashboard-plus {
        height:auto !important;
        min-height:0 !important;
        max-height:none !important;
        grid-template-columns:minmax(0,1fr) !important;
        justify-items:stretch !important;
        gap:11px !important;
        padding:14px !important;
        border-radius:1.35rem !important;
        text-align:center !important;
    }
    body.ampol-app.is-dashboard-route .dashboard-plus__mark { width:62px !important; height:66px !important; margin-inline:auto !important; }
    body.ampol-app.is-dashboard-route .dashboard-plus__copy { grid-column:1/-1 !important; min-width:0 !important; width:100% !important; }
    body.ampol-app.is-dashboard-route .dashboard-plus__eyebrow,
    body.ampol-app.is-dashboard-route .dashboard-plus__chips { justify-content:center !important; }
    body.ampol-app.is-dashboard-route .dashboard-plus__copy h2 { margin-top:.45rem !important; font-size:1rem !important; line-height:1.55 !important; }
    body.ampol-app.is-dashboard-route .dashboard-plus__copy p { width:100% !important; max-width:none !important; font-size:.66rem !important; line-height:1.9 !important; text-align:center !important; }
    body.ampol-app.is-dashboard-route .dashboard-plus__chips { margin-top:.65rem !important; }
    body.ampol-app.is-dashboard-route .dashboard-plus__chips span { padding:.38rem .55rem !important; }
    body.ampol-app.is-dashboard-route .dashboard-plus__status { grid-column:1/-1 !important; width:100% !important; }

    body.ampol-app.is-dashboard-route .ampol-account-command {
        min-height:0 !important;
        padding:.9rem !important;
        border-radius:1.35rem !important;
    }
    body.ampol-app.is-dashboard-route .ampol-account-command__orbit {
        width:6.5rem !important;
        height:6.5rem !important;
        margin:1rem auto .8rem !important;
        box-shadow:inset 0 0 25px color-mix(in srgb,var(--v12-accent) 12%,transparent),0 0 0 .75rem color-mix(in srgb,var(--v12-accent) 4%,transparent) !important;
    }
    body.ampol-app.is-dashboard-route .ampol-account-command__orbit>b { font-size:2.35rem !important; }
    body.ampol-app.is-dashboard-route .ampol-account-command__orbit>small { bottom:1.15rem !important; }
    body.ampol-app.is-dashboard-route .ampol-account-command__meters { margin-top:.75rem !important; }
    body.ampol-app.is-dashboard-route .ampol-account-command>footer { margin-top:.75rem !important; padding-top:.65rem !important; }

    .ampol-ticket-experience { padding-bottom:calc(110px + env(safe-area-inset-bottom)) !important; }
    .ampol-ticket-chat {
        height:calc(100dvh - 116px) !important;
        min-height:520px !important;
        max-height:720px !important;
        border-radius:20px !important;
    }
    .ampol-ticket-chat__head { padding:12px 15px !important; }
    .ampol-ticket-chat__stream { padding:14px !important; }
    .ampol-ticket-chat__stream > .ampol-ticket-bubble { min-width:min(220px,80%) !important; max-width:92% !important; }
    .ampol-ticket-composer {
        padding:8px !important;
        box-shadow:0 -8px 22px color-mix(in srgb,var(--theme-text) 5%,transparent) !important;
        backdrop-filter:none !important;
    }

    /* Compact AMPOL emoji sheet: the conversation stays visible and responsive. */
    .ampol-ticket-composer .ampol-emoji-picker { position:static !important; }
    .ampol-ticket-composer .ampol-emoji-picker__toggle {
        width:44px !important;
        min-width:44px !important;
        padding:0 !important;
        gap:0 !important;
    }
    .ampol-ticket-composer .ampol-emoji-picker__toggle > span:last-child { display:none !important; }
    .ampol-ticket-composer .ampol-emoji-picker__toggle > .ampol-emoji-art {
        width:25px !important;
        height:25px !important;
        flex-basis:25px !important;
    }
    .ampol-emoji-picker__panel {
        position:fixed !important;
        inset:auto 8px calc(86px + env(safe-area-inset-bottom)) 8px !important;
        width:auto !important;
        max-width:none !important;
        max-height:360px !important;
        max-height:min(52dvh,360px) !important;
        overflow-x:hidden !important;
        overflow-y:auto !important;
        overscroll-behavior:contain !important;
        border-radius:18px !important;
        padding:10px !important;
        box-shadow:0 18px 45px rgba(0,0,0,.22) !important;
        -webkit-overflow-scrolling:touch;
    }
    .ampol-emoji-picker__panel > header { position:sticky; z-index:2; top:-10px; background:var(--theme-panel); padding:9px 2px 8px !important; }
    .ampol-emoji-picker__panel section { margin-top:8px !important; }
    .ampol-emoji-picker__panel section > div { grid-template-columns:repeat(5,minmax(0,1fr)) !important; gap:5px !important; }
    .ampol-emoji-picker__panel section button {
        min-height:58px !important;
        gap:1px !important;
        border-radius:9px !important;
        padding:4px 1px !important;
        touch-action:manipulation;
    }
    .ampol-emoji-picker__panel section button:hover { transform:none !important; }
    .ampol-emoji-picker__panel section button .ampol-emoji-art { width:31px !important; height:31px !important; }
    .ampol-emoji-picker__panel section button > span:last-child { font-size:6px !important; }
    .ampol-custom-emoji { width:1.65em !important; height:1.65em !important; vertical-align:-.43em !important; }

    .ampol-about-team > header { gap:.75rem !important; }
    .ampol-team-controls { width:100%; justify-content:space-between; }
    .ampol-team-controls span { font-size:.62rem; }
    .ampol-team-rail { overflow-x:auto !important; scroll-snap-type:x mandatory; overscroll-behavior-inline:contain; }
    .ampol-team-track { animation:none !important; transform:none !important; }
    .ampol-team-card { scroll-snap-align:start; }
    .store-mobile-swipe-hint { display:flex; align-items:center; justify-content:center; gap:.45rem; margin-top:.1rem; color:var(--theme-muted); font-size:.65rem; font-weight:800; }
    .store-mobile-swipe-hint span { color:var(--v12-accent); font-size:1rem; }
}

@media (prefers-reduced-motion:reduce) {
    .ampol-team-track { animation:none !important; }
}
