@import url('https://fonts.googleapis.com/css2?family=Lato:wght@400;700;900&family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@24,400,0,0&display=swap');
.material-symbols-outlined {
    font-family: 'Material Symbols Outlined' !important; font-weight: normal !important; font-style: normal !important;
    font-size: 24px; line-height: 1 !important; display: inline-block !important; white-space: nowrap !important;
    font-feature-settings: 'liga' !important; -webkit-font-smoothing: antialiased !important;
}
.ai-wrapper * { box-sizing: border-box; font-family: 'Lato', sans-serif; }

.show { display: block !important; }
.showf { display: flex !important; }
.hide { display: none !important; }

/* -- PANEL BOCZNY (RWD) -- */
.ai-sidebar {
    position: fixed; top: 0; right: 0; height: 100vh; width: 425px; max-width: 100vw;
    background: #ffffff; z-index: 105000; box-shadow: -5px 0 30px rgba(0,0,0,0.15);
    display: flex; flex-direction: column; color: #33404c;
    transform: translateX(100%); transition: transform 0.35s cubic-bezier(0.2, 0.8, 0.2, 1);
    padding-bottom: env(safe-area-inset-bottom);
}
.ai-sidebar.open { transform: translateX(0); }
.ai-resizer { position: absolute; left: -4px; top: 0; width: 8px; height: 100%; cursor: ew-resize; background: transparent; z-index: 106000; }
@media (max-width: 480px) { .ai-sidebar { width: 100% !important; } ai-resizer { display: none; } }

.ai-scroll { overflow-y: auto !important; overscroll-behavior: contain; }
.ai-scroll::-webkit-scrollbar { width: 5px; }
.ai-scroll::-webkit-scrollbar-track { background: transparent; }
.ai-scroll::-webkit-scrollbar-thumb { background: #c2c9d1; border-radius: 4px; }
textarea#chat-textarea { scrollbar-width: none; -ms-overflow-style: none; }
textarea#chat-textarea::-webkit-scrollbar { display: none; }

/* -- NAGŁÓWEK I ZAKŁADKI -- */
.ai-header { background: #33404c; padding: 12px 16px; display: flex; justify-content: space-between; align-items: center; }
.ai-header-title { font-size: 16px; font-weight: 700; margin: 0; color: #ffffff !important; display:flex; align-items:center; gap:8px; }
.ai-close-btn { background: transparent; border: none; color: #a1aab3; cursor: pointer; display: flex; align-items: center; justify-content: center; padding: 4px; border-radius: 4px; }
.ai-close-btn:hover { color: white; }

.ai-tabs { display: flex; background: #ffffff; border-bottom: 1px solid #e1e5e9; flex-shrink: 0; }
.ai-tab { flex: 1; padding: 14px 0; background: transparent; border: none; cursor: pointer; font-size: 14px; font-weight: 700; color: #5d6974; border-bottom: 3px solid transparent; transition: all 0.2s; }
.ai-tab:hover { color: #33404c; background: #f4f7f9; }
.ai-tab.ai-active { color: #D41D3C; border-bottom-color: #D41D3C; }

.ai-view { display: none; flex-direction: column; flex: 1; overflow: hidden; background: #ffffff; }
.ai-view.ai-active { display: flex; }

.ai-limit-banner {
    background: #fff5f6; border-bottom: 1px solid #ffccd3; color: #D41D3C;
    padding: 8px 15px; font-size: 13px; font-weight: 700; text-align: center; display: none; align-items: center; justify-content: center; gap: 5px; flex-shrink:0;
}

/* -- DROPDOWN ZAŁĄCZNIKÓW -- */
.ai-dropdown-bar { padding: 12px 20px; background: #f4f7f9; border-bottom: 1px solid #e1e5e9; flex-shrink: 0; }
.ai-dropdown-btn { background: #fff; border: 1px solid #e1e5e9; padding: 8px 12px; border-radius: 4px; display: flex; justify-content: space-between; align-items: center; cursor: pointer; font-weight: 700; font-size: 13px; color: #33404c; }
.ai-dropdown-menu { display: none; position: absolute; top: 100%; left: 0; right: 0; background: #fff; border: 1px solid #e1e5e9; border-radius: 0 0 4px 4px; z-index: 100; max-height: 200px; box-shadow: 0 4px 15px rgba(0,0,0,0.1); }
.ai-dropdown-menu.show { display: block; }
.ai-doc-item { display: flex; gap: 10px; padding: 10px 12px; border-bottom: 1px solid #eee; cursor: pointer; color: #5d6974; font-size: 13px; align-items: center; }

/* -- CZAT I WIADOMOŚCI -- */
.ai-msg-group { margin-bottom: 15px; }
.ai-user-bubble { background: #f4f7f9; padding: 10px 15px; border-radius: 4px; margin-bottom: 5px; color: #33404c; border-bottom-right-radius: 0; font-size: 14px; font-weight: 700; display: flex; justify-content: space-between; align-items: center; gap: 10px; border-left: 3px solid #c2c9d1; cursor: pointer; }
.ai-user-bubble:hover { background: #e8eef3; }
.ai-bot-bubble { background: #f7fbfc; border-left: 3px solid #1fabc5; padding: 12px 15px; border-radius: 4px; border-bottom-left-radius: 0; margin-bottom: 15px; position: relative; }
.ai-bot-bubble.collapsed { display: none; }
.ai-bot-label { font-size: 11px; font-weight: bold; color: #1fabc5; margin-bottom: 8px; text-transform: uppercase; letter-spacing: 0.5px; }
.ai-bot-content { font-size: 14px; color: #33404c; line-height: 1.5; }
.ai-bot-content p { margin: 0 0 10px 0; }
.ai-bot-content p:last-child { margin: 0; }
.ai-bot-content ul { margin: 0 0 10px 0; padding-left: 20px; }
.ai-bot-content li { margin-bottom: 5px; }
.ai-source-box { margin-top: 12px; padding: 10px; background: #ffffff; border: 1px solid #e1e5e9; font-size: 12px; color: #5d6974; border-radius: 2px; }
.ai-copy-btn { position: absolute; top: 8px; right: 8px; background: transparent; border: none; color: #a1aab3; cursor: pointer; transition: all 0.2s; padding: 4px 6px; display: flex; align-items: center; gap: 4px; border-radius: 4px; font-weight: 700; font-size: 11px; text-transform: uppercase; }
.ai-copy-btn:hover { color: #1fabc5; background: #e6f0f5; }

.ai-typing-indicator { display: flex; align-items: center; gap: 10px; height: 24px; }
.ai-spinner { border: 2px solid #e1e5e9; border-top: 2px solid #1fabc5; border-radius: 50%; width: 16px; height: 16px; animation: spin 1s linear infinite; display: inline-block; }
@keyframes spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } }
.ai-throbber-text { color: #5d6974; font-size: 13px; font-style: italic; }

/* -- AKORDEONY -- */
.ai-accordion { border: 1px solid #e1e5e9; border-radius: 4px; margin-bottom: 8px; background: #ffffff; }
.ai-accordion-header { padding: 12px 15px; cursor: pointer; display: flex; justify-content: space-between; align-items: center; font-size: 13px; font-weight: bold; background: #f4f7f9; border-radius: 3px; transition: background 0.2s; }
.ai-accordion-header:hover { background: #e8eef3; }
.ai-accordion-content { display: none; padding: 15px; border-top: 1px solid #e1e5e9; font-size: 13px; line-height: 1.5; color: #33404c; background:#ffffff; }

/* -- BLOK KONTAKTOWY -- */
.ai-contact-info { background: #ffffff; border: 1px solid #e1e5e9; border-radius: 4px; padding: 15px; text-align: center; font-size: 14px; color: #5d6974; margin-top: 30px; }

/* -- HISTORIA -- */
.ai-history-list { display: flex; flex-direction: column; gap: 10px; }
.ai-history-item { background: #ffffff; border: 1px solid #e1e5e9; border-radius: 4px; padding: 15px; cursor: pointer; transition: all 0.2s; display: flex; flex-direction: column; gap: 5px; }
.ai-history-item:hover { border-color: #1fabc5; }
.ai-history-title { font-size: 14px; font-weight: 700; color: #33404c; }
.ai-history-date { font-size: 12px; color: #5d6974; display:flex; align-items:center; gap:5px; }
.ai-history-header { margin: 0 0 15px 0; font-size: 16px; font-weight:700; color: #33404c; }

/* -- INPUT I AKCJE -- */
.ai-input-area { padding: 15px 20px; background: #ffffff; border-top: 1px solid #e1e5e9; flex-shrink: 0; }
.ai-input-box { display: flex; gap: 10px; align-items: flex-end; transition: opacity 0.2s; }
.ai-input-box.ai-disabled { opacity: 0.5; pointer-events: none; }
#chat-textarea.expired { pointer-events: none; cursor: not-allowed; }
#chat-textarea { flex: 1; min-height: 44px; max-height: 120px; padding: 12px; border: 1px solid #e1e5e9; border-radius: 4px; font-size: 14px; outline: none; resize: none; background: #f4f7f9; }
#chat-textarea:focus { border-color: #1fabc5; background: #ffffff; }
.ai-send-btn { width: 44px; height: 44px; min-width: 44px; background: #D41D3C; color: white; border: none; cursor: pointer; border-radius: 4px; display: flex; align-items: center; justify-content: center; }
.ai-send-btn:hover { background: #b31731; }
.ai-send-btn.expired,
.ai-btn-secondary.expired {
    opacity: 0.5;
    cursor: not-allowed;
}
.ai-btn-secondary { background: #f4f7f9; color: #33404c; border: 1px solid #e1e5e9; padding: 8px 12px; border-radius: 4px; font-size: 13px; font-weight: 700; cursor: pointer; transition: all 0.2s; display: inline-flex; align-items: center; justify-content: center; gap: 5px; text-decoration: none; }
.ai-btn-secondary:hover { background: #e1e5e9; border-color: #c2c9d1; }

#ai-archived-notice { display: none; padding: 15px; text-align: center; background: #f4f7f9; color: #5d6974; border-radius: 4px; border: 1px dashed #c2c9d1; font-size: 13px; line-height: 1.5; }
.ai-locked-overlay { display: none; flex-direction: column; align-items: center; justify-content: center; text-align: center; background: #f4f7f9; border: 1px dashed #e1e5e9; padding: 20px; border-radius: 4px; }
.ai-btn-primary { background: #1fabc5; color: white; border: none; padding: 12px 25px; border-radius: 4px; font-weight: 700; cursor: pointer; font-size: 14px; display: inline-flex; align-items: center; justify-content: center; width: 100%; text-decoration: none; transition: background 0.2s; }
.ai-btn-primary:hover { background: #188d9f; color: white; }

/* ==============================================
    PRZYCISK PANELU AI (Kółko -> Expand + Tooltip)
    ============================================== */
#ai-floating-container {
    position: fixed; bottom: 30px; right: 30px; z-index: 104000;
    display: flex; flex-direction: column; align-items: flex-end; gap: 15px;
}

/* Dymek / Tooltip */
#ai-floating-tooltip {
    display: none; background: #D41D3C; color: #fff; padding: 15px 20px;
    border-radius: 8px; width: 290px; font-size: 14px; font-weight: 700; line-height: 1.5;
    box-shadow: 0 4px 15px rgba(212, 29, 60, 0.3); position: relative;
    opacity: 0; transform: translateY(10px); transition: opacity 0.4s ease, transform 0.4s ease;
    align-items: flex-start; gap: 10px;
}
#ai-floating-tooltip::after {
    content: ''; position: absolute; bottom: -6px; right: 22px;
    border-width: 6px 6px 0; border-style: solid; border-color: #D41D3C transparent transparent transparent;
}
#ai-tooltip-close {
    background: none; border: none; color: rgba(255,255,255,0.7); cursor: pointer; padding: 0; flex-shrink: 0; margin-top: 2px;
}
#ai-tooltip-close:hover { color: #fff; }

/* Przycisk (Kółko -> Pigułka) */
.ai-btn-floating {
    background: linear-gradient(135deg, #1fabc5, #126b7d); color: white; border: none;
    border-radius: 30px; height: 56px; width: 56px; display: flex; align-items: center;
    justify-content: flex-start; overflow: hidden; cursor: pointer;
    transition: width 0.4s cubic-bezier(0.2, 0.8, 0.2, 1), transform 0.2s, background 0.3s, border-color 0.3s;
    box-shadow: 0 5px 15px rgba(18, 107, 125, 0.35); padding: 0;
}
.ai-btn-floating .ai-icon-wrap { width: 56px; height: 56px; min-width: 56px; display: flex; align-items: center; justify-content: center; }
.ai-btn-floating .ai-text-wrap { white-space: nowrap; font-weight: 700; font-size: 15px; opacity: 0; transition: opacity 0.3s; padding-right: 24px; line-height: 1; }

/* Expand tylko na Desktop */
@media (min-width: 769px) {
    .ai-btn-floating:hover { width: 175px; }
    .ai-btn-floating:hover .ai-text-wrap { opacity: 1; transition-delay: 0.1s; }
}

/* Wyłączenie tooltipu na mobile */
@media (max-width: 768px) {
    #ai-floating-tooltip { display: none !important; }
}

/* Odwrócony przycisk (dla stanów niedostępnych) */
.ai-btn-floating.ai-btn-inverted {
    background: #ffffff !important; color: #1fabc5 !important; border: 2px solid #1fabc5 !important;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1) !important;
}

/* -- POPUP KIEDY AI NIEDOSTĘPNE -- */
#ai-popup-alert { display:none; position:fixed; bottom:90px; right:30px; background:#fff; border:1px solid #e1e5e9; border-radius:8px; padding:25px; box-shadow:0 10px 30px rgba(0,0,0,0.15); z-index:104000; width:320px; max-width: calc(100vw - 40px); flex-direction:column; gap:10px; }
.ai-popup-close { position:absolute; top:12px; right:12px; cursor:pointer; color:#a1aab3; background:none; border:none; padding:4px; display:flex; align-items:center; justify-content:center; }
.ai-popup-close:hover { color:#33404c; }

/* -- PANEL DEV – otwieralny z niewidzialnego przycisku w lewym dolnym rogu ekranu -- */
#ai-mock-toggler { position: fixed; bottom: 0; left: 0; width: 50px; height: 50px; background: transparent; z-index: 999998; cursor: pointer; }
#ai-mock-panel { position: fixed; bottom: 10px; left: 10px; background: #ffffff; border: 1px solid #e1e5e9; padding: 20px; border-radius: 8px; box-shadow: 0 10px 30px rgba(0,0,0,0.2); z-index: 999999; display: none; width: 300px; max-height:90vh; overflow-y:auto; }

.chat-proposed { display: none; }