/* ============ AION — PUBLIC CHAT WIDGET ============
 * Widget chat reutilisable, auto-injecte par op-agent.js.
 * Inclus sur toutes les pages du site vitrine via <link rel="stylesheet">.
 * Les classes gardent leur prefixe legacy (pcp-, op-agent-) — pas renomme.
 */

#public-chat-bubble {
    position:fixed; right:28px; bottom:28px;
    width:56px; height:56px; border-radius:50%;
    background:#C4A265; color:#08080B;
    display:none; align-items:center; justify-content:center;
    cursor:pointer; z-index:1000;
    box-shadow:0 6px 24px rgba(196,162,101,0.35), 0 2px 8px rgba(0,0,0,0.3);
    transition:transform .2s, box-shadow .2s, opacity .2s;
    border:none;
    animation:
        pcp-fadein .3s ease-out,
        pcp-bounce-attention 0.9s ease-in-out .3s 2,
        pcp-pulse-glow 2.4s ease-out 2.1s infinite;
}
#public-chat-bubble.visible::after {
    content:'';
    position:absolute;
    inset:0;
    border-radius:50%;
    pointer-events:none;
    box-shadow:0 0 0 0 rgba(196,162,101,0.55);
    animation:pcp-ring 2.4s ease-out 2.1s infinite;
}
#public-chat-bubble.visible { display:flex; }
#public-chat-bubble:hover { transform:scale(1.05); box-shadow:0 10px 32px rgba(196,162,101,0.45); }
#public-chat-bubble svg { width:24px; height:24px; flex-shrink:0; }
#public-chat-bubble .pcp-bubble-label {
    display:none;
    font-family:'Inter',system-ui,sans-serif;
    font-size:14px; font-weight:500;
    color:#08080B;
    white-space:nowrap;
    letter-spacing:0.01em;
}
#public-chat-bubble.expanded {
    width:auto; height:52px;
    padding:0 22px 0 18px;
    border-radius:26px;
    gap:10px;
    animation:
        pcp-fadein .3s ease-out,
        pcp-expand .5s cubic-bezier(0.2,0.8,0.2,1) forwards,
        pcp-pulse-glow 2.4s ease-out 0s infinite;
}
#public-chat-bubble.expanded::after { display:none; }
#public-chat-bubble.expanded .pcp-bubble-label {
    display:inline;
    animation:pcp-label-fade .45s .15s both;
}
@keyframes pcp-fadein {
    from { opacity:0; transform:scale(0.8); }
    to   { opacity:1; transform:scale(1); }
}
@keyframes pcp-bounce-attention {
    0%, 100% { transform:translateY(0) scale(1); }
    40%      { transform:translateY(-8px) scale(1.06); }
    70%      { transform:translateY(0) scale(1); }
}
@keyframes pcp-pulse-glow {
    0%   { box-shadow:0 6px 24px rgba(196,162,101,0.35), 0 2px 8px rgba(0,0,0,0.3), 0 0 0 rgba(196,162,101,0); }
    50%  { box-shadow:0 8px 32px rgba(196,162,101,0.6), 0 2px 8px rgba(0,0,0,0.3), 0 0 18px rgba(196,162,101,0.4); }
    100% { box-shadow:0 6px 24px rgba(196,162,101,0.35), 0 2px 8px rgba(0,0,0,0.3), 0 0 0 rgba(196,162,101,0); }
}
@keyframes pcp-ring {
    0%   { box-shadow:0 0 0 0 rgba(196,162,101,0.55); }
    70%  { box-shadow:0 0 0 18px rgba(196,162,101,0); }
    100% { box-shadow:0 0 0 0 rgba(196,162,101,0); }
}
@keyframes pcp-expand {
    from { width:56px; padding:0; gap:0; border-radius:50%; }
    to   { padding:0 22px 0 18px; gap:10px; border-radius:26px; }
}
@keyframes pcp-label-fade {
    from { opacity:0; transform:translateX(-4px); }
    to   { opacity:1; transform:translateX(0); }
}

#public-chat-panel {
    position:fixed; right:28px; bottom:28px;
    width:320px; height:440px; max-height:calc(100vh - 56px);
    background:#FAFAF8; color:#2a2420;
    border:1px solid rgba(196,162,101,0.4);
    border-radius:16px;
    box-shadow:0 10px 40px rgba(0,0,0,0.12), 0 4px 16px rgba(0,0,0,0.08);
    display:flex; flex-direction:column; overflow:hidden;
    z-index:1001;
    font-family:'Inter',system-ui,-apple-system,sans-serif;
    animation:pcp-slideup .2s cubic-bezier(0.2,0.8,0.2,1);
}
#public-chat-panel.hidden { display:none; }
#public-chat-panel.closing { animation:pcp-slidedown .2s cubic-bezier(0.2,0.8,0.2,1) forwards; }
@keyframes pcp-slideup {
    from { opacity:0; transform:translateY(16px); }
    to   { opacity:1; transform:none; }
}
@keyframes pcp-slidedown {
    from { opacity:1; transform:none; }
    to   { opacity:0; transform:translateY(16px); }
}

.pcp-header {
    position:relative;
    flex-shrink:0;
    padding:12px 44px 10px 16px;
    display:flex; flex-direction:column; gap:2px;
    border-bottom:1px solid rgba(196,162,101,0.25);
    background:linear-gradient(180deg, #FAFAF8, #F4F0E8);
}
.pcp-title {
    font-family:'Cormorant Garamond',Georgia,serif;
    font-style:italic; font-weight:500;
    font-size:20px; color:#2a2420;
    letter-spacing:0.01em;
    line-height:1.2;
}
.pcp-subtitle {
    font-family:'Inter',system-ui,sans-serif;
    font-size:12px; color:#7a7a7a;
    line-height:1.3;
}
.pcp-close {
    position:absolute; top:14px; right:14px;
    width:24px; height:24px; border:none; background:transparent;
    cursor:pointer; color:#8a7a60; font-size:22px; line-height:1;
    padding:0; display:flex; align-items:center; justify-content:center;
    transition:color .15s;
    border-radius:4px;
}
.pcp-close:hover { color:#2a2420; background:rgba(196,162,101,0.1); }

.pcp-body {
    flex:1; overflow-y:auto;
    padding:12px;
    display:flex; flex-direction:column; gap:8px;
    background:#FAFAF8;
}
.pcp-body::-webkit-scrollbar { width:6px; }
.pcp-body::-webkit-scrollbar-thumb { background:rgba(196,162,101,0.35); border-radius:3px; }

.pcp-msg {
    max-width:85%; padding:8px 12px;
    border-radius:12px;
    font-size:13px; line-height:1.5;
    white-space:pre-wrap; word-wrap:break-word;
}
.pcp-msg.bot {
    align-self:flex-start;
    background:#FDFBF6;
    border:1px solid rgba(196,162,101,0.3);
    color:#2a2420;
    border-bottom-left-radius:4px;
}
.pcp-msg.user {
    align-self:flex-end;
    background:#F2DADA;
    color:#4a2a2a;
    border-bottom-right-radius:4px;
}
.pcp-msg.err {
    align-self:center;
    background:transparent;
    color:#a06060;
    font-size:12px; font-style:italic;
    padding:6px 10px;
}

/* Bulle speciale unlock — message + bouton vers l'espace personnel */
.pcp-msg.pcp-unlock {
    background:#FDFBF6;
    border:1px solid #C4A265;
    border-left:3px solid #C4A265;
    box-shadow:0 2px 8px rgba(196,162,101,0.18);
    display:flex; flex-direction:column; gap:10px;
    padding:14px 16px;
}
.pcp-unlock-text {
    font-family:'Cormorant Garamond',Georgia,serif;
    font-style:italic; font-size:15px;
    color:#2a2420; line-height:1.4;
}
.pcp-unlock-btn {
    align-self:flex-start;
    background:#C4A265; color:#08080B;
    padding:8px 14px; border-radius:8px;
    font-family:'Inter',system-ui,sans-serif;
    font-size:13px; font-weight:500;
    letter-spacing:0.02em;
    text-decoration:none;
    transition:background .15s, transform .1s;
}
.pcp-unlock-btn:hover { background:#B89050; }
.pcp-unlock-btn:active { transform:scale(0.97); }

.pcp-typing { display:flex; gap:4px; padding:10px 14px; align-self:flex-start; }
.pcp-typing span {
    width:6px; height:6px; border-radius:50%;
    background:#C4A265;
    animation:pcp-blink 1.2s infinite both;
}
.pcp-typing span:nth-child(2) { animation-delay:0.15s; }
.pcp-typing span:nth-child(3) { animation-delay:0.3s; }
@keyframes pcp-blink {
    0%,80%,100% { opacity:0.3; transform:scale(0.8); }
    40% { opacity:1; transform:scale(1); }
}

.pcp-footer {
    flex-shrink:0;
    padding:8px 10px; gap:6px;
    display:flex; align-items:flex-end;
    border-top:1px solid rgba(196,162,101,0.25);
    background:#F4F0E8;
}
.pcp-input {
    flex:1; resize:none; border:1px solid rgba(196,162,101,0.3);
    border-radius:10px; padding:8px 10px;
    font-family:inherit; font-size:13px; line-height:1.4;
    background:#FFF; color:#2a2420;
    max-height:90px; min-height:44px;
    outline:none;
    transition:border-color .15s;
}
.pcp-input:focus { border-color:#C4A265; }
.pcp-send {
    flex-shrink:0;
    width:36px; height:36px; border:none; border-radius:10px;
    background:#C4A265; color:#08080B;
    cursor:pointer;
    display:flex; align-items:center; justify-content:center;
    transition:background .15s, transform .1s;
}
.pcp-send:hover { background:#B89050; }
.pcp-send:active { transform:scale(0.95); }
.pcp-send:disabled { opacity:0.5; cursor:not-allowed; }
.pcp-send svg { width:16px; height:16px; }

/* Clear button — icone poubelle discrete dans le footer sous l'input */
.pcp-clear-row {
    flex-shrink:0;
    display:flex; justify-content:flex-end;
    padding:4px 14px 8px;
    background:#F4F0E8;
    border-top:none;
}
.pcp-clear {
    background:transparent; border:none;
    color:#999; font-size:11px;
    font-family:'Inter',system-ui,sans-serif;
    cursor:pointer; padding:2px 4px;
    display:inline-flex; align-items:center; gap:5px;
    transition:color .15s;
    letter-spacing:0.02em;
}
.pcp-clear:hover { color:#2a2420; }
.pcp-clear svg { width:13px; height:13px; stroke:currentColor; fill:none; stroke-width:1.8; }

@media (max-width:767px) {
    /* Bottom-sheet : ancré en bas, pleine largeur, 1/3 de la hauteur.
       Laisse ~2/3 du site visible au-dessus. Coins arrondis en haut uniquement. */
    #public-chat-panel {
        right:0; left:0; bottom:0; top:auto;
        width:100%; height:33vh; max-height:33vh;
        min-height:280px;
        border-radius:16px 16px 0 0;
        border:none;
        border-top:1px solid rgba(196,162,101,0.4);
        box-shadow:0 -8px 24px rgba(0,0,0,0.12);
    }
    .pcp-header { position:sticky; top:0; z-index:2; padding:8px 44px 6px 14px; }
    .pcp-title { font-size:17px; }
    .pcp-subtitle { font-size:11px; }
    .pcp-body { padding:8px 10px; }
    .pcp-msg { font-size:13px; padding:7px 11px; }
    .pcp-footer { padding:6px 8px; }
    .pcp-input { min-height:38px; padding:6px 9px; }
    .pcp-send { width:32px; height:32px; }
    #public-chat-bubble { right:20px; bottom:20px; }
}
