/* e-Trener SQL – e-edumade.pl */

.etrener-wrap {
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    max-width: 720px;
    margin: 0 auto;
}

.etrener-box {
    display: flex;
    flex-direction: column;
    height: 580px;
    background: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
}

/* HEADER */
.etrener-header {
    padding: 12px 16px;
    display: flex;
    align-items: center;
    gap: 10px;
    border-bottom: 1px solid #e8e8e8;
}
.etrener-header.oracle  { background: #FAEEDA; }
.etrener-header.sqlserver { background: #E6F1FB; }

.etrener-avatar {
    width: 36px; height: 36px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 11px; font-weight: 600;
    flex-shrink: 0;
}
.oracle  .etrener-avatar { background: #FAC775; color: #633806; }
.sqlserver .etrener-avatar { background: #378ADD; color: #ffffff; }

.etrener-header-text { flex: 1; }
.etrener-header-text h3 { margin: 0; font-size: 14px; font-weight: 600; color: #1a1a1a; }
.etrener-header-text p  { margin: 0; font-size: 12px; color: #666; }

.etrener-badge {
    font-size: 11px; padding: 3px 9px;
    border-radius: 20px; font-weight: 500;
}
.oracle   .etrener-badge { background: #FAC775; color: #633806; }
.sqlserver .etrener-badge { background: #B5D4F4; color: #0C447C; }

/* LEVEL BAR */
.etrener-levelbar {
    display: flex;
    gap: 6px;
    padding: 9px 14px;
    background: #f7f7f7;
    border-bottom: 1px solid #e8e8e8;
    align-items: center;
}
.etrener-levelbar span.label {
    font-size: 12px; color: #777; margin-right: 2px; white-space: nowrap;
}
.etrener-level-btn {
    flex: 1;
    padding: 5px 4px;
    font-size: 12px;
    border: 1px solid #ddd;
    border-radius: 6px;
    cursor: pointer;
    background: #fff;
    color: #555;
    text-align: center;
    transition: all .15s;
}
.etrener-level-btn:hover { background: #f0f0f0; }
.etrener-level-btn.active.oracle-btn   { background: #FAC775; color: #633806; border-color: #BA7517; font-weight: 600; }
.etrener-level-btn.active.sqlserver-btn { background: #B5D4F4; color: #0C447C; border-color: #378ADD; font-weight: 600; }

/* MESSAGES */
.etrener-messages {
    flex: 1;
    overflow-y: auto;
    padding: 14px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    background: #fafafa;
}

.etrener-msg { display: flex; max-width: 90%; }
.etrener-msg.user { align-self: flex-end; flex-direction: row-reverse; }

.etrener-bubble {
    padding: 9px 13px;
    border-radius: 14px;
    font-size: 14px;
    line-height: 1.65;
    word-break: break-word;
}
.etrener-msg.bot  .etrener-bubble { background: #fff; color: #1a1a1a; border: 1px solid #e8e8e8; border-radius: 4px 14px 14px 14px; }
.etrener-msg.user.oracle    .etrener-bubble { background: #FAEEDA; color: #633806; border-radius: 14px 4px 14px 14px; border: none; }
.etrener-msg.user.sqlserver .etrener-bubble { background: #E6F1FB; color: #0C447C; border-radius: 14px 4px 14px 14px; border: none; }

.etrener-bubble pre {
    background: #f4f4f4;
    border-radius: 6px;
    padding: 10px 12px;
    font-size: 12px;
    margin: 8px 0 0;
    overflow-x: auto;
    font-family: 'Courier New', monospace;
    border: 1px solid #e0e0e0;
}
.etrener-bubble code {
    background: #f0f0f0;
    padding: 2px 5px;
    border-radius: 4px;
    font-size: 12px;
    font-family: 'Courier New', monospace;
}

.etrener-level-notice {
    align-self: center;
    font-size: 12px;
    padding: 5px 12px;
    border-radius: 6px;
    color: #555;
    background: #f0f0f0;
    border: 1px solid #ddd;
}

/* CHIPS */
.etrener-chips { display: flex; flex-wrap: wrap; gap: 5px; margin-top: 8px; }
.etrener-chip {
    font-size: 12px; padding: 3px 10px;
    border-radius: 20px; cursor: pointer;
    background: transparent; transition: background .12s;
}
.oracle .etrener-chip    { border: 1px solid #BA7517; color: #633806; }
.oracle .etrener-chip:hover { background: #FAEEDA; }
.sqlserver .etrener-chip    { border: 1px solid #378ADD; color: #185FA5; }
.sqlserver .etrener-chip:hover { background: #E6F1FB; }

/* TYPING */
.etrener-typing { display: flex; gap: 4px; align-items: center; padding: 8px 12px; }
.etrener-dot {
    width: 6px; height: 6px; border-radius: 50%;
    background: #aaa; animation: eTrenerBounce 1.2s infinite;
}
.etrener-dot:nth-child(2) { animation-delay: .2s; }
.etrener-dot:nth-child(3) { animation-delay: .4s; }
@keyframes eTrenerBounce {
    0%,60%,100% { transform: translateY(0); }
    30%          { transform: translateY(-5px); }
}

/* INPUT */
.etrener-input-area {
    padding: 10px 14px;
    border-top: 1px solid #e8e8e8;
    display: flex;
    gap: 8px;
    align-items: flex-end;
    background: #fff;
}
.etrener-input-area textarea {
    flex: 1; resize: none;
    border: 1px solid #ddd;
    border-radius: 8px;
    padding: 8px 12px;
    font-size: 14px;
    font-family: inherit;
    line-height: 1.5;
    max-height: 90px;
    outline: none;
    color: #1a1a1a;
    background: #fff;
}
.etrener-input-area textarea:focus { border-color: #999; }

.etrener-send-btn {
    width: 36px; height: 36px;
    border-radius: 50%; border: none;
    cursor: pointer; display: flex;
    align-items: center; justify-content: center;
    flex-shrink: 0; transition: opacity .15s;
}
.etrener-send-btn:hover { opacity: .85; }
.oracle    .etrener-send-btn { background: #FAC775; }
.sqlserver .etrener-send-btn { background: #378ADD; }
.oracle    .etrener-send-btn svg { fill: #633806; }
.sqlserver .etrener-send-btn svg { fill: #ffffff; }

/* FOOTER */
.etrener-footer {
    font-size: 11px; color: #aaa;
    text-align: center; padding: 5px 0 4px;
    background: #fff; border-top: 1px solid #f0f0f0;
}

/* ── NOWE KOLORY – Python, Excel, Power BI ── */

/* Python – zielono-niebieski */
.etrener-header.python   { background: #EAF3DE; }
.python .etrener-avatar  { background: #639922; color: #fff; }
.python .etrener-badge   { background: #C0DD97; color: #3B6D11; }
.python .etrener-send-btn { background: #639922; }
.python .etrener-send-btn svg { fill: #fff; }
.python .etrener-msg.user .etrener-bubble { background: #EAF3DE; color: #3B6D11; }
.etrener-level-btn.active.python-btn { background: #C0DD97; color: #3B6D11; border-color: #639922; font-weight: 600; }
.python .etrener-chip    { border: 1px solid #639922; color: #3B6D11; }
.python .etrener-chip:hover { background: #EAF3DE; }

/* Excel – zielony Microsoft */
.etrener-header.excel   { background: #E2F0E8; }
.excel .etrener-avatar  { background: #1D6F42; color: #fff; }
.excel .etrener-badge   { background: #A8D5B5; color: #0A4A2A; }
.excel .etrener-send-btn { background: #1D6F42; }
.excel .etrener-send-btn svg { fill: #fff; }
.excel .etrener-msg.user .etrener-bubble { background: #E2F0E8; color: #0A4A2A; }
.etrener-level-btn.active.excel-btn { background: #A8D5B5; color: #0A4A2A; border-color: #1D6F42; font-weight: 600; }
.excel .etrener-chip    { border: 1px solid #1D6F42; color: #0A4A2A; }
.excel .etrener-chip:hover { background: #E2F0E8; }

/* Power BI – żółto-pomarańczowy */
.etrener-header.powerbi   { background: #FEF9EE; }
.powerbi .etrener-avatar  { background: #F2C811; color: #6B4C00; }
.powerbi .etrener-badge   { background: #F9E48A; color: #6B4C00; }
.powerbi .etrener-send-btn { background: #F2C811; }
.powerbi .etrener-send-btn svg { fill: #6B4C00; }
.powerbi .etrener-msg.user .etrener-bubble { background: #FEF9EE; color: #6B4C00; }
.etrener-level-btn.active.powerbi-btn { background: #F9E48A; color: #6B4C00; border-color: #F2C811; font-weight: 600; }
.powerbi .etrener-chip    { border: 1px solid #F2C811; color: #6B4C00; }
.powerbi .etrener-chip:hover { background: #FEF9EE; }

/* Pasek limitu pytań */
.etrener-limit-bar {
    padding: 6px 14px;
    font-size: 12px;
    background: #fff8e1;
    border-bottom: 1px solid #ffe082;
    color: #795548;
    text-align: center;
}
.etrener-limit-bar a { color: #1565C0; text-decoration: underline; }
