:root {
    --technion-chat-navy: #1a2f5e;
    --technion-chat-gold: #c9a227;
    --technion-chat-border: #e5e3dc;
    --technion-chat-width: 400px;
}

.chat-float-btn {
    position: fixed;
    bottom: 24px;
    right: 24px;
    width: 56px;
    height: 56px;
    border-radius: 50%;
    background-color: var(--technion-chat-navy);
    color: #fff;
    border: 2px solid var(--technion-chat-gold);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
    z-index: 9999;
    transition: transform 0.15s ease, background-color 0.15s ease;
}

.chat-float-btn-icon {
    display: block !important;
    width: 26px !important;
    height: 26px !important;
    max-width: none !important;
    pointer-events: none !important;
}

.chat-float-btn:hover {
    background-color: #24407f;
    transform: scale(1.05);
}

body.rtl .chat-float-btn {
    right: auto;
    left: 24px;
}

.chat-panel {
    position: fixed;
    top: 0;
    right: 0;
    height: 100vh;
    width: var(--technion-chat-width);
    background: #fff;
    border-left: 1px solid var(--technion-chat-border);
    box-shadow: -4px 0 20px rgba(0, 0, 0, 0.12);
    z-index: 9999;
    display: flex;
    flex-direction: column;
    transform: translateX(100%);
    transition: transform 0.3s ease;
}

.chat-panel.open {
    transform: translateX(0);
}

body.rtl .chat-panel {
    right: auto;
    left: 0;
    border-left: none;
    border-right: 1px solid var(--technion-chat-border);
    box-shadow: 4px 0 20px rgba(0, 0, 0, 0.12);
    transform: translateX(-100%);
}

body.rtl .chat-panel.open {
    transform: translateX(0);
}

.chat-panel-resize-handle {
    position: absolute;
    top: 0;
    left: 0;
    width: 6px;
    height: 100%;
    cursor: ew-resize;
    z-index: 1;
}

body.rtl .chat-panel-resize-handle {
    left: auto;
    right: 0;
}

#technion-chat-iframe {
    flex: 1 1 auto;
    min-height: 0;
    width: 100%;
    height: 100%;
    border: none;
}

@media (min-width: 768px) {
    body.technion-chat-open {
        margin-right: var(--technion-chat-width);
        transition: margin 0.3s ease;
    }

    body.rtl.technion-chat-open {
        margin-right: 0;
        margin-left: var(--technion-chat-width);
    }
}

@media (max-width: 767px) {
    .chat-panel {
        width: 100% !important;
    }

    .chat-panel-resize-handle {
        display: none;
    }

    body.technion-chat-open {
        margin: 0 !important;
    }
}

/* CookieConsent popup (#cm, orestbida v2) sits fixed at bottom-right by default,
   exactly where the chat button is on LTR pages. Lift it just above the button;
   positioning only — its buttons/behaviour are untouched. On RTL pages the chat
   button is bottom-left, so no change is needed there. While the panel is open on
   desktop, also keep the popup clear of the panel. */
body:not(.rtl) #cm.box.bottom.right {
    bottom: 96px; /* 24px offset + 56px button + 16px gap */
}
body:not(.rtl).technion-chat-open #cm.box.bottom.right {
    right: calc(var(--technion-chat-width) + 20px);
}
