#pixelis-bot-minimize-btn {
    background: none;
    border: none;
    color: white;
    cursor: pointer;
    padding: 0;
    display: flex;
    align-items: center;
    opacity: 0.7;
    transition: opacity 0.2s;
}

#pixelis-bot-minimize-btn:hover {
    opacity: 1;
}

#pixelis-bot-open-icon {
    position: fixed;
    bottom: 20px;
    right: 20px;
    width: 60px;
    height: 60px;
    background: var(--pixelis-bot-primary-color);
    border-radius: 50%;
    display: none;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
    z-index: 10000;
    transition: transform 0.3s cubic-bezier(0.25, 0.8, 0.25, 1);
}

#pixelis-bot-open-icon:hover {
    transform: scale(1.1);
}

/* Tylko ikony będące bezpośrednim dzieckiem przycisku leżą jedna na drugiej.
   Bez '>' ta reguła łapała też sylwetkę konsultanta (siedzi w <span>) i
   wyrywała ją z kółka: absolutnie pozycjonowany SVG liczy rozmiar względem
   przycisku, więc omijał przycinanie i wylewał się na stronę. */
#pixelis-bot-open-icon > svg {
    color: white;
    position: absolute;
    transition: transform 0.3s ease, opacity 0.3s ease;
}

#pixelis-bot-open-icon .close-icon {
    transform: scale(0);
    opacity: 0;
}

/* Logic to swap icons will be in JS */
#pixelis-bot-open-icon.is-open .message-icon {
    transform: scale(0);
    opacity: 0;
}

#pixelis-bot-open-icon.is-open .close-icon {
    transform: scale(1);
    opacity: 1;
}


/* --- 2.2: otwarte okno chowa pływający przycisk ---
   Miał z-index 10000, okno czatu 9999, oba przyklejone do prawego dolnego rogu.
   Jego "X" siadał DOKŁADNIE na przycisku wysyłania i całkowicie go zasłaniał,
   więc kliknięcie w miejsce, gdzie każdy spodziewa się "wyślij", zamykało czat.
   Do zamykania służy przycisk w nagłówku i samo kliknięcie w nagłówek. */
#pixelis-bot-open-icon.is-open {
    display: none !important;
}


/* --- 2.3: przycisk z sylwetką konsultanta ---
   Zamiast ikonki dymku pokazujemy awatar. Białe kółko z obwódką w kolorze
   marki czyta się na każdym tle strony, także na zdjęciu w tle. */
#pixelis-bot-open-icon.has-mascot {
    box-sizing: border-box;
    background: #fff;
    border: 2px solid var(--pixelis-bot-primary-color);
    width: 64px;
    height: 64px;
    padding: 0;
    overflow: visible;
}

#pixelis-bot-open-icon.has-mascot .message-icon {
    display: none;
}

/* Krzyżyk zamykania musi być widoczny na białym tle awatara. */
#pixelis-bot-open-icon.has-mascot .close-icon {
    color: var(--pixelis-bot-primary-color);
}