/* ============================================
 * SEIKIN AI ADVISOR — CSS
 * File: css/components/advisor.css
 * ============================================
 * Giao diện chat kiểu ChatGPT, dark/light mode
 */

/* CSS Variables */
:root {
    --adv-bg: #f7f7f8;
    --adv-bg-chat: #ffffff;
    --adv-bg-user: #f0f0f5;
    --adv-bg-assistant: #ffffff;
    --adv-bg-input: #ffffff;
    --adv-bg-header: #ffffff;
    --adv-bg-code: #f5f5f5;
    --adv-bg-table-header: #f0f0f5;
    --adv-bg-quick: #e8e8f0;
    --adv-bg-sessions: #ffffff;
    --adv-text: #1a1a2e;
    --adv-text-secondary: #6b6b80;
    --adv-text-muted: #9b9bb0;
    --adv-border: #e0e0e8;
    --adv-border-input: #d0d0d8;
    --adv-accent: #4a6cf7;
    --adv-accent-hover: #3a5ce0;
    --adv-positive: #16a34a;
    --adv-negative: #dc2626;
    --adv-shadow: 0 1px 3px rgba(0,0,0,0.06);
    --adv-radius: 12px;
    --adv-radius-sm: 8px;
}

[data-theme="dark"] {
    --adv-bg: #0d1117;
    --adv-bg-chat: #161b22;
    --adv-bg-user: #1c2333;
    --adv-bg-assistant: #161b22;
    --adv-bg-input: #1c2333;
    --adv-bg-header: #0d1117;
    --adv-bg-code: #1c2333;
    --adv-bg-table-header: #1c2333;
    --adv-bg-quick: #1c2333;
    --adv-bg-sessions: #161b22;
    --adv-text: #e6edf3;
    --adv-text-secondary: #8b949e;
    --adv-text-muted: #6e7681;
    --adv-border: #30363d;
    --adv-border-input: #3d444d;
    --adv-accent: #58a6ff;
    --adv-accent-hover: #79c0ff;
    --adv-positive: #3fb950;
    --adv-negative: #f85149;
    --adv-shadow: 0 1px 3px rgba(0,0,0,0.3);
}

/* ============================================
 * PAGE LAYOUT
 * ============================================ */

.adv-page {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 60px);
    background: var(--adv-bg);
    position: relative;
    overflow: hidden;
}

/* ============================================
 * HEADER
 * ============================================ */

.adv-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 20px;
    background: var(--adv-bg-header);
    border-bottom: 1px solid var(--adv-border);
    flex-shrink: 0;
    z-index: 10;
}

.adv-header-left {
    display: flex;
    align-items: center;
    gap: 10px;
}

.adv-logo {
    font-size: 1.5em;
}

.adv-title {
    font-size: 1.1em;
    font-weight: 600;
    color: var(--adv-text);
    margin: 0;
}

.adv-status {
    font-size: 10px;
    line-height: 1;
}
.adv-status.connected { color: var(--adv-positive); }
.adv-status.disconnected { color: var(--adv-negative); }

.adv-header-right {
    display: flex;
    gap: 8px;
}

.adv-btn {
    padding: 6px 12px;
    border: 1px solid var(--adv-border);
    border-radius: var(--adv-radius-sm);
    background: transparent;
    color: var(--adv-text);
    cursor: pointer;
    font-size: 0.85em;
    transition: all 0.15s;
}
.adv-btn:hover {
    background: var(--adv-bg-quick);
    border-color: var(--adv-accent);
}

/* ============================================
 * SESSIONS PANEL (slide-in)
 * ============================================ */

.adv-sessions-panel {
    position: absolute;
    top: 0;
    left: -300px;
    width: 300px;
    height: 100%;
    background: var(--adv-bg-sessions);
    border-right: 1px solid var(--adv-border);
    z-index: 20;
    transition: left 0.25s ease;
    display: flex;
    flex-direction: column;
}
.adv-sessions-panel.active {
    left: 0;
    box-shadow: 4px 0 15px rgba(0,0,0,0.1);
}

.adv-sessions-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px;
    border-bottom: 1px solid var(--adv-border);
}
.adv-sessions-header h3 {
    margin: 0;
    font-size: 0.95em;
    color: var(--adv-text);
}

.adv-btn-close {
    background: none;
    border: none;
    color: var(--adv-text-secondary);
    cursor: pointer;
    font-size: 1.2em;
    padding: 4px;
}

.adv-btn-close-panel {
    background: var(--adv-bg-user);
    border: 1px solid var(--adv-border);
    border-radius: var(--adv-radius-sm);
    color: var(--adv-text-secondary);
    cursor: pointer;
    font-size: 0.8em;
    font-weight: 600;
    padding: 5px 12px;
    transition: background 0.15s, color 0.15s;
}
.adv-btn-close-panel:hover {
    background: var(--adv-accent);
    color: #fff;
    border-color: var(--adv-accent);
}

.adv-sessions-list {
    flex: 1;
    overflow-y: auto;
    padding: 8px;
}

/* Gap Report Section */
.adv-gap-section {
    border-bottom: 1px solid var(--adv-border);
}

.adv-gap-toggle {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 10px 16px;
    background: none;
    border: none;
    color: var(--adv-text);
    cursor: pointer;
    font-size: 0.85em;
    font-weight: 600;
    gap: 6px;
    transition: background 0.15s;
}
.adv-gap-toggle:hover {
    background: var(--adv-bg-user);
}

.adv-gap-badge {
    background: var(--adv-accent);
    color: #fff;
    font-size: 0.75em;
    font-weight: 700;
    padding: 1px 6px;
    border-radius: 10px;
    min-width: 18px;
    text-align: center;
}

.adv-gap-chevron {
    margin-left: auto;
    font-size: 0.8em;
    transition: transform 0.2s;
}
.adv-gap-section.open .adv-gap-chevron {
    transform: rotate(90deg);
}

.adv-gap-content {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.25s ease;
    padding: 0 12px;
}
.adv-gap-section.open .adv-gap-content {
    max-height: 300px;
    padding: 0 12px 12px;
}

.adv-gap-metrics {
    display: flex;
    gap: 8px;
    margin-bottom: 8px;
}
.adv-gap-metric {
    flex: 1;
    text-align: center;
    background: var(--adv-bg-user);
    border-radius: var(--adv-radius-sm);
    padding: 8px 4px;
}
.adv-gap-number {
    font-size: 1.3em;
    font-weight: 700;
    color: var(--adv-accent);
}
.adv-gap-label {
    font-size: 0.7em;
    color: var(--adv-text-secondary);
    margin-top: 2px;
}

.adv-gap-topics {
    margin-bottom: 8px;
}
.adv-gap-topic {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 4px 0;
    font-size: 0.8em;
    color: var(--adv-text);
    border-bottom: 1px solid var(--adv-border);
}
.adv-gap-topic:last-child { border-bottom: none; }
.adv-gap-count {
    font-weight: 600;
    color: var(--adv-text-secondary);
}

.adv-gap-actions {
    display: flex;
    gap: 6px;
    margin-top: 6px;
}
.adv-gap-detail-btn {
    flex: 1;
    padding: 6px 8px;
    background: var(--adv-bg-user);
    border: 1px solid var(--adv-border);
    border-radius: var(--adv-radius-sm);
    color: var(--adv-accent);
    font-size: 0.75em;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s, color 0.15s;
}
.adv-gap-detail-btn:hover {
    background: var(--adv-accent);
    color: #fff;
}
.adv-gap-brief-btn {
    color: var(--adv-positive, #16a34a);
    border-color: var(--adv-positive, #16a34a);
}
.adv-gap-brief-btn:hover {
    background: var(--adv-positive, #16a34a);
    color: #fff;
}

.adv-gap-empty {
    font-size: 0.8em;
    color: var(--adv-text-secondary);
    text-align: center;
    padding: 8px 0;
}
.adv-gap-loading {
    font-size: 0.8em;
    color: var(--adv-text-secondary);
    text-align: center;
    padding: 8px 0;
}

/* Gap Report Modal */
.adv-gap-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.5);
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
}
.adv-gap-modal {
    background: var(--adv-bg-chat);
    border-radius: 12px;
    width: 90%;
    max-width: 600px;
    max-height: 80vh;
    display: flex;
    flex-direction: column;
    box-shadow: 0 8px 32px rgba(0,0,0,0.2);
}
.adv-gap-modal-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 16px 20px;
    border-bottom: 1px solid var(--adv-border);
}
.adv-gap-modal-header h3 {
    margin: 0;
    font-size: 1em;
    color: var(--adv-text);
}
.adv-gap-modal-body {
    padding: 20px;
    overflow-y: auto;
    font-size: 0.85em;
    line-height: 1.6;
    color: var(--adv-text);
}

/* AI Brief Modal (wider) */
.adv-gap-modal-wide {
    max-width: 800px;
}

.adv-brief-toolbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 12px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--adv-border);
}
.adv-brief-hint {
    font-size: 0.8em;
    color: var(--adv-text-secondary);
}
.adv-brief-copy-btn {
    padding: 6px 14px;
    background: var(--adv-positive, #16a34a);
    color: #fff;
    border: none;
    border-radius: var(--adv-radius-sm);
    font-size: 0.82em;
    font-weight: 600;
    cursor: pointer;
    white-space: nowrap;
    transition: opacity 0.15s;
}
.adv-brief-copy-btn:hover {
    opacity: 0.85;
}
.adv-brief-content {
    background: var(--adv-bg-user);
    border: 1px solid var(--adv-border);
    border-radius: var(--adv-radius-sm);
    padding: 16px;
    font-size: 0.82em;
    line-height: 1.5;
    white-space: pre-wrap;
    word-break: break-word;
    max-height: 55vh;
    overflow-y: auto;
    font-family: 'Consolas', 'Monaco', monospace;
}

.adv-session-item {
    padding: 10px 12px;
    border-radius: var(--adv-radius-sm);
    cursor: pointer;
    margin-bottom: 4px;
    position: relative;
    transition: background 0.15s;
}
.adv-session-item:hover {
    background: var(--adv-bg-quick);
}
.adv-session-item.active {
    background: var(--adv-bg-user);
    border-left: 3px solid var(--adv-accent);
}

.adv-session-title {
    font-size: 0.85em;
    color: var(--adv-text);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding-right: 24px;
}

.adv-session-meta {
    font-size: 0.75em;
    color: var(--adv-text-muted);
    margin-top: 2px;
}

.adv-session-delete {
    position: absolute;
    right: 8px;
    top: 50%;
    transform: translateY(-50%);
    background: none;
    border: none;
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.15s;
    font-size: 0.8em;
}
.adv-session-item:hover .adv-session-delete {
    opacity: 0.6;
}
.adv-session-delete:hover {
    opacity: 1 !important;
}

.adv-sessions-empty {
    text-align: center;
    color: var(--adv-text-muted);
    padding: 40px 16px;
    font-size: 0.85em;
}

/* ============================================
 * CHAT AREA
 * ============================================ */

.adv-chat-area {
    flex: 1;
    overflow-y: auto;
    padding: 20px 40px;
    max-width: min(1200px, calc(100% - 40px));
    margin: 0 auto;
    width: 100%;
}

/* ============================================
 * WELCOME
 * ============================================ */

.adv-welcome {
    text-align: center;
    padding: 40px 20px;
}

.adv-welcome-icon {
    font-size: 3em;
    margin-bottom: 16px;
}

.adv-welcome-text {
    color: var(--adv-text);
    line-height: 1.7;
    font-size: 0.95em;
    max-width: min(800px, calc(100% - 40px));
    margin: 0 auto 24px;
    text-align: left;
}
.adv-welcome-text p {
    margin: 8px 0;
}
.adv-welcome-text strong {
    color: var(--adv-accent);
}

/* ============================================
 * QUICK ACTIONS
 * ============================================ */

.adv-quick-actions {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 8px;
    max-width: min(800px, calc(100% - 40px));
    margin: 0 auto;
}

.adv-quick-btn {
    padding: 8px 14px;
    background: var(--adv-bg-quick);
    border: 1px solid var(--adv-border);
    border-radius: 20px;
    color: var(--adv-text);
    cursor: pointer;
    font-size: 0.82em;
    transition: all 0.15s;
    white-space: nowrap;
}
.adv-quick-btn:hover {
    background: var(--adv-accent);
    color: #fff;
    border-color: var(--adv-accent);
}

/* ============================================
 * MESSAGES
 * ============================================ */

.adv-messages {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.adv-message {
    display: flex;
    gap: 12px;
    padding: 12px 16px;
    border-radius: var(--adv-radius);
    position: relative;
}

.adv-msg-user {
    background: var(--adv-bg-user);
}

.adv-msg-assistant {
    background: var(--adv-bg-assistant);
    border: 1px solid var(--adv-border);
}

.adv-msg-error {
    background: rgba(220, 38, 38, 0.08);
    border: 1px solid rgba(220, 38, 38, 0.2);
}

.adv-msg-avatar {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.1em;
    background: var(--adv-bg-quick);
}

.adv-msg-body {
    flex: 1;
    min-width: 0;
}

.adv-msg-header {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 4px;
}

.adv-msg-name {
    font-weight: 600;
    font-size: 0.85em;
    color: var(--adv-text);
}

.adv-msg-time {
    font-size: 0.75em;
    color: var(--adv-text-muted);
}

.adv-msg-content {
    color: var(--adv-text);
    font-size: 0.9em;
    line-height: 1.65;
    word-wrap: break-word;
}

/* ============================================
 * MARKDOWN CONTENT trong messages
 * ============================================ */

.adv-msg-content .adv-md-h2 {
    font-size: 1.15em;
    margin: 12px 0 8px;
    color: var(--adv-accent);
}
.adv-msg-content .adv-md-h3 {
    font-size: 1.05em;
    margin: 10px 0 6px;
    color: var(--adv-text);
}
.adv-msg-content .adv-md-h4 {
    font-size: 0.95em;
    margin: 8px 0 4px;
    color: var(--adv-text-secondary);
}

.adv-msg-content strong {
    color: var(--adv-text);
}

.adv-msg-content p {
    margin: 6px 0;
}

.adv-msg-content .adv-blockquote {
    border-left: 3px solid var(--adv-accent);
    padding: 8px 12px;
    margin: 8px 0;
    background: var(--adv-bg-code);
    border-radius: 0 var(--adv-radius-sm) var(--adv-radius-sm) 0;
    color: var(--adv-text-secondary);
    font-size: 0.9em;
}

/* Tables */
.adv-table-wrapper {
    overflow-x: auto;
    margin: 8px 0;
}

.adv-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.85em;
}
.adv-table th {
    background: var(--adv-bg-table-header);
    padding: 6px 10px;
    text-align: left;
    font-weight: 600;
    border-bottom: 2px solid var(--adv-border);
    white-space: nowrap;
}
.adv-table td {
    padding: 5px 10px;
    border-bottom: 1px solid var(--adv-border);
}
.adv-table tr:hover td {
    background: var(--adv-bg-quick);
}

/* Lists */
.adv-unordered-list, .adv-ordered-list {
    margin: 6px 0;
    padding-left: 20px;
}
.adv-ul-item, .adv-ol-item {
    margin: 3px 0;
}

/* Code */
.adv-inline-code {
    background: var(--adv-bg-code);
    padding: 2px 6px;
    border-radius: 4px;
    font-family: 'Consolas', 'Monaco', monospace;
    font-size: 0.9em;
}

.adv-code-block {
    background: var(--adv-bg-code);
    padding: 12px;
    border-radius: var(--adv-radius-sm);
    overflow-x: auto;
    margin: 8px 0;
    font-family: 'Consolas', 'Monaco', monospace;
    font-size: 0.85em;
    line-height: 1.5;
}

/* Colors */
.adv-positive { color: var(--adv-positive); font-weight: 500; }
.adv-negative { color: var(--adv-negative); font-weight: 500; }

/* Stock symbol links */
.adv-stock-symbol {
    color: var(--adv-accent);
    cursor: pointer;
    font-weight: 600;
    text-decoration: underline dotted;
}
.adv-stock-symbol:hover {
    color: var(--adv-accent-hover);
    text-decoration: underline;
}

/* Links */
.adv-link {
    color: var(--adv-accent);
    text-decoration: none;
}
.adv-link:hover {
    text-decoration: underline;
}

.adv-hr {
    border: none;
    border-top: 1px solid var(--adv-border);
    margin: 12px 0;
}

/* ============================================
 * ACTIONS (copy, feedback)
 * ============================================ */

.adv-msg-actions {
    display: flex;
    gap: 4px;
    margin-top: 8px;
    opacity: 0;
    transition: opacity 0.15s;
}
.adv-message:hover .adv-msg-actions {
    opacity: 1;
}

.adv-action-btn {
    background: none;
    border: 1px solid transparent;
    border-radius: 6px;
    padding: 3px 6px;
    cursor: pointer;
    font-size: 0.8em;
    opacity: 0.5;
    transition: all 0.15s;
}
.adv-action-btn:hover {
    opacity: 1;
    background: var(--adv-bg-quick);
    border-color: var(--adv-border);
}
.adv-feedback-btn.active {
    opacity: 1;
    background: var(--adv-bg-quick);
}

/* ============================================
 * TYPING INDICATOR
 * ============================================ */

.adv-typing-dots {
    display: flex;
    gap: 4px;
    padding: 4px 0;
}
.adv-typing-dots span {
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: var(--adv-text-muted);
    animation: advTyping 1.2s infinite;
}
.adv-typing-dots span:nth-child(2) { animation-delay: 0.2s; }
.adv-typing-dots span:nth-child(3) { animation-delay: 0.4s; }

@keyframes advTyping {
    0%, 60%, 100% { opacity: 0.3; transform: scale(0.8); }
    30% { opacity: 1; transform: scale(1); }
}

/* Streaming cursor */
.adv-cursor {
    animation: advBlink 0.8s infinite;
    color: var(--adv-accent);
    font-weight: 300;
}
@keyframes advBlink {
    0%, 50% { opacity: 1; }
    51%, 100% { opacity: 0; }
}

/* ============================================
 * FOLLOW-UPS
 * ============================================ */

.adv-follow-ups {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    padding: 0 40px;
    max-width: min(1200px, calc(100% - 40px));
    margin: 0 auto;
    width: 100%;
}

.adv-follow-btn {
    padding: 6px 12px;
    background: transparent;
    border: 1px solid var(--adv-border);
    border-radius: 16px;
    color: var(--adv-text-secondary);
    cursor: pointer;
    font-size: 0.8em;
    transition: all 0.15s;
}
.adv-follow-btn:hover {
    border-color: var(--adv-accent);
    color: var(--adv-accent);
    background: var(--adv-bg-quick);
}

/* ============================================
 * INPUT AREA
 * ============================================ */

.adv-input-area {
    padding: 12px 40px 16px;
    max-width: min(1200px, calc(100% - 40px));
    margin: 0 auto;
    width: 100%;
    flex-shrink: 0;
    box-sizing: border-box;
}

/* Attachment banner */
.adv-attachment-banner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background: var(--adv-bg-msg);
    border: 1px solid var(--adv-accent);
    border-radius: 12px 12px 0 0;
    padding: 8px 12px;
    margin-bottom: -2px;
    font-size: 0.82em;
    color: var(--adv-text);
}
.adv-attach-info {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 0;
}
.adv-attach-icon {
    flex-shrink: 0;
    font-size: 1.1em;
}
.adv-attach-text {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.adv-attach-text em {
    color: var(--adv-text-muted);
    font-size: 0.9em;
}
.adv-attach-remove {
    flex-shrink: 0;
    background: none;
    border: none;
    color: var(--adv-text-muted);
    cursor: pointer;
    font-size: 1em;
    padding: 2px 6px;
    border-radius: 4px;
    transition: background 0.15s, color 0.15s;
}
.adv-attach-remove:hover {
    background: rgba(255, 80, 80, 0.15);
    color: var(--color-negative);
}

/* Attach button */
.adv-attach-btn {
    flex-shrink: 0;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    border: none;
    background: transparent;
    color: var(--adv-text-muted);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s, color 0.15s;
    padding: 0;
}
.adv-attach-btn:hover {
    background: var(--adv-bg-hover);
    color: var(--adv-accent);
}
.adv-attach-btn svg {
    width: 18px;
    height: 18px;
}

.adv-input-wrapper {
    display: flex;
    align-items: center;
    gap: 6px;
    background: var(--adv-bg-input);
    border: 2px solid var(--adv-border-input);
    border-radius: 24px;
    padding: 6px 6px 6px 8px;
    transition: border-color 0.2s, box-shadow 0.2s;
    box-sizing: border-box;
}
.adv-input-wrapper:focus-within {
    border-color: var(--adv-accent);
    box-shadow: 0 0 0 3px rgba(74, 108, 247, 0.12);
}

.adv-input {
    flex: 1;
    border: none;
    outline: none;
    background: transparent;
    color: var(--adv-text);
    font-size: 0.9em;
    line-height: 1.5;
    resize: none;
    max-height: 120px;
    min-height: 24px;
    padding: 4px 0;
    font-family: inherit;
    box-sizing: border-box;
}
.adv-input::placeholder {
    color: var(--adv-text-muted);
}

.adv-send-btn {
    flex-shrink: 0;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: none;
    background: var(--adv-accent);
    color: #fff;
    cursor: pointer;
    font-size: 1.1em;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s;
}
.adv-send-btn:hover {
    background: var(--adv-accent-hover);
}

.adv-disclaimer {
    text-align: center;
    font-size: 0.72em;
    color: var(--adv-text-muted);
    margin-top: 8px;
}

/* ============================================
 * RESPONSIVE (Mobile)
 * ============================================ */

@media (max-width: 768px) {
    .adv-page {
        height: calc(100vh - 50px);
    }

    .adv-header {
        padding: 8px 12px;
    }

    .adv-title {
        font-size: 0.95em;
    }

    .adv-btn-sessions {
        display: none;
    }

    .adv-chat-area {
        padding: 12px;
    }

    .adv-quick-actions {
        gap: 6px;
    }

    .adv-quick-btn {
        font-size: 0.78em;
        padding: 6px 10px;
    }

    .adv-message {
        padding: 8px 12px;
        gap: 8px;
    }

    .adv-msg-avatar {
        width: 28px;
        height: 28px;
        font-size: 0.9em;
    }

    .adv-input-area {
        padding: 8px 12px 12px;
    }

    .adv-input-wrapper {
        padding: 4px 4px 4px 8px;
    }

    .adv-attach-btn {
        width: 28px;
        height: 28px;
    }

    .adv-attachment-banner {
        font-size: 0.78em;
        padding: 6px 10px;
    }

    .adv-sessions-panel {
        width: 260px;
    }
}

/* ============================================
 * COACH MODE
 * ============================================ */

/* Toggle button */
.adv-coach-toggle {
    position: relative;
    font-weight: 500;
    transition: all 0.2s;
}

.adv-coach-toggle.active {
    background: linear-gradient(135deg, #f59e0b, #ef4444);
    color: #fff;
    border-color: #f59e0b;
    box-shadow: 0 2px 8px rgba(245, 158, 11, 0.3);
}

.adv-coach-toggle.active:hover {
    background: linear-gradient(135deg, #d97706, #dc2626);
    border-color: #d97706;
}

/* Coach mode page overrides */
.adv-page.coach-mode .adv-header {
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.08), rgba(239, 68, 68, 0.05));
    border-bottom-color: rgba(245, 158, 11, 0.3);
}

[data-theme="dark"] .adv-page.coach-mode .adv-header {
    background: linear-gradient(135deg, rgba(245, 158, 11, 0.12), rgba(239, 68, 68, 0.06));
    border-bottom-color: rgba(245, 158, 11, 0.25);
}

/* Coach quick action buttons */
.adv-quick-btn.adv-quick-coach {
    border-color: rgba(245, 158, 11, 0.4);
    background: rgba(245, 158, 11, 0.08);
}

.adv-quick-btn.adv-quick-coach:hover {
    background: #f59e0b;
    border-color: #f59e0b;
    color: #fff;
}

[data-theme="dark"] .adv-quick-btn.adv-quick-coach {
    border-color: rgba(245, 158, 11, 0.35);
    background: rgba(245, 158, 11, 0.1);
    color: #fbbf24;
}

[data-theme="dark"] .adv-quick-btn.adv-quick-coach:hover {
    background: #f59e0b;
    color: #fff;
}

/* ============================================
 * HELP MODAL
 * ============================================ */
.adv-btn-help {
    min-width: auto;
    padding: 0.3rem 0.5rem;
    font-size: 0.85rem;
}

.adv-help-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.5);
    z-index: 9999;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1rem;
}

.adv-help-modal {
    background: var(--color-bg-primary, #fff);
    color: var(--color-text-primary, #1a1a2e);
    border-radius: 12px;
    max-width: 640px;
    width: 100%;
    max-height: 80vh;
    display: flex;
    flex-direction: column;
    box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
}

.adv-help-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1rem 1.5rem;
    border-bottom: 1px solid var(--color-border, #e2e8f0);
}

.adv-help-header h2 { margin: 0; font-size: 1.1rem; }

.adv-help-close {
    background: none;
    border: none;
    font-size: 1.2rem;
    cursor: pointer;
    color: var(--color-text-secondary, #64748b);
    padding: 0.25rem 0.5rem;
    border-radius: 4px;
}
.adv-help-close:hover { background: var(--color-bg-secondary, #f1f5f9); }

.adv-help-body {
    padding: 1.5rem;
    overflow-y: auto;
    font-size: 0.9rem;
    line-height: 1.6;
}

.adv-help-section { margin-bottom: 1.5rem; }
.adv-help-section:last-child { margin-bottom: 0; }
.adv-help-section h3 { margin: 0 0 0.5rem; font-size: 1rem; }
.adv-help-section h4 { margin: 0.8rem 0 0.4rem; font-size: 0.9rem; color: var(--color-text-secondary, #64748b); }
.adv-help-section ul, .adv-help-section ol { margin: 0.3rem 0; padding-left: 1.5rem; }
.adv-help-section li { margin-bottom: 0.25rem; }

.adv-help-coach {
    background: rgba(245, 158, 11, 0.06);
    border: 1px solid rgba(245, 158, 11, 0.2);
    border-radius: 8px;
    padding: 1rem;
}

.adv-help-table {
    width: 100%;
    border-collapse: collapse;
    margin: 0.5rem 0;
    font-size: 0.85rem;
}
.adv-help-table td {
    padding: 0.35rem 0.5rem;
    border-bottom: 1px solid var(--color-border, #e2e8f0);
}
.adv-help-table td:first-child {
    white-space: nowrap;
    width: 90px;
    color: var(--color-text-secondary, #64748b);
}

[data-theme="dark"] .adv-help-coach {
    background: rgba(245, 158, 11, 0.08);
    border-color: rgba(245, 158, 11, 0.25);
}

/* ============================================
 * COACH NAV — Persistent Bottom Navigation Bar
 * ============================================ */

/* Summary bar (top #advQuickActions area) */
/* Progress summary bar */
.adv-cnav-summary {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 6px 10px;
    font-size: 0.82em;
    font-weight: 600;
    color: #f59e0b;
}
.adv-cnav-summary span { white-space: nowrap; }
.adv-cnav-bar {
    flex: 1;
    height: 6px;
    background: var(--adv-border, #e0e0e8);
    border-radius: 3px;
    overflow: hidden;
}
.adv-cnav-bar-fill {
    height: 100%;
    background: linear-gradient(90deg, #f59e0b, #ef4444);
    border-radius: 3px;
    transition: width 0.4s ease;
}
[data-theme="dark"] .adv-cnav-summary { color: #fbbf24; }

/* Nav wrap (inside messages area) */
.adv-cnav-wrap {
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid var(--adv-border, #e0e0e8);
}
[data-theme="dark"] .adv-cnav-wrap { border-top-color: #333; }

/* Horizontal pipeline flow */
.adv-cnav-flow {
    display: flex;
    align-items: stretch;
    gap: 0;
    overflow-x: auto;
    padding: 2px 0 4px;
    scrollbar-width: thin;
}
.adv-cnav-flow::-webkit-scrollbar { height: 3px; }
.adv-cnav-flow::-webkit-scrollbar-thumb { background: var(--adv-border, #ccc); border-radius: 2px; }
.adv-cnav-arrow {
    display: flex;
    align-items: center;
    padding: 0 3px;
    color: var(--adv-text-secondary, #999);
    font-size: 0.75em;
    opacity: 0.45;
    flex-shrink: 0;
}
.adv-cnav-card {
    min-width: 135px;
    border: 1.5px solid var(--adv-border, #e0e0e8);
    border-radius: 10px;
    padding: 10px 12px;
    border-top: 3px solid var(--adv-border, #e0e0e8);
    background: var(--adv-bg-assistant, #fff);
    transition: all 0.2s;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
}
.adv-cnav-card-done {
    border-top-color: var(--adv-positive, #16a34a);
    background: rgba(22, 163, 74, 0.04);
}
.adv-cnav-card-todo {
    border-top-color: #f59e0b;
}
.adv-cnav-card-title {
    font-weight: 600;
    font-size: 0.82em;
    margin-bottom: 3px;
    color: var(--adv-text, #1a1a2e);
    white-space: nowrap;
}
.adv-cnav-card-status {
    font-size: 0.73em;
    opacity: 0.6;
    margin-bottom: 8px;
    color: var(--adv-text-secondary, #666);
    flex: 1;
}
.adv-cnav-card-btns {
    display: flex;
    gap: 5px;
    flex-wrap: nowrap;
}
.adv-cnav-card-btn {
    padding: 4px 10px;
    border-radius: 12px;
    border: 1px solid var(--adv-border, #e0e0e8);
    background: transparent;
    color: var(--adv-text-secondary, #666);
    font-size: 0.73em;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s;
    white-space: nowrap;
}
.adv-cnav-card-btn:hover {
    border-color: #f59e0b;
    color: #f59e0b;
}
.adv-cnav-card-btn-primary {
    background: rgba(245, 158, 11, 0.1);
    border-color: #f59e0b;
    color: #f59e0b;
    font-weight: 600;
}
.adv-cnav-card-btn-primary:hover {
    background: #f59e0b;
    color: #fff;
}
.adv-cnav-card-btn-done {
    background: rgba(22, 163, 74, 0.08);
    border-color: var(--adv-positive, #16a34a);
    color: var(--adv-positive, #16a34a);
    font-weight: 600;
}
.adv-cnav-card-btn-done:hover {
    background: var(--adv-positive, #16a34a);
    color: #fff;
}

/* Dark mode cards */
[data-theme="dark"] .adv-cnav-card {
    background: var(--adv-bg-input, #1c2333);
    border-color: #444;
}
[data-theme="dark"] .adv-cnav-card-done {
    border-top-color: #4ade80;
    background: rgba(74, 222, 128, 0.06);
}
[data-theme="dark"] .adv-cnav-card-todo {
    border-top-color: #f59e0b;
}
[data-theme="dark"] .adv-cnav-arrow { color: #666; }
[data-theme="dark"] .adv-cnav-card-title { color: var(--adv-text, #e6edf3); }
[data-theme="dark"] .adv-cnav-card-status { color: var(--adv-text-secondary, #8b949e); }
[data-theme="dark"] .adv-cnav-card-btn {
    border-color: rgba(255,255,255,0.15);
    color: var(--adv-text-secondary, #8b949e);
}
[data-theme="dark"] .adv-cnav-card-btn:hover {
    border-color: #fbbf24;
    color: #fbbf24;
}
[data-theme="dark"] .adv-cnav-card-btn-primary {
    background: rgba(245, 158, 11, 0.12);
    border-color: #f59e0b;
    color: #fbbf24;
}
[data-theme="dark"] .adv-cnav-card-btn-primary:hover {
    background: #f59e0b;
    color: #1a1a2e;
}
[data-theme="dark"] .adv-cnav-card-btn-done {
    background: rgba(74, 222, 128, 0.1);
    border-color: #4ade80;
    color: #4ade80;
}
[data-theme="dark"] .adv-cnav-card-btn-done:hover {
    background: #4ade80;
    color: #1a1a2e;
}

/* All done message */
.adv-cnav-complete {
    padding: 10px 0 4px;
    color: var(--adv-positive, #16a34a);
    font-weight: 600;
    font-size: 0.85em;
    text-align: center;
}
[data-theme="dark"] .adv-cnav-complete { color: #4ade80; }

/* Mobile responsive */
@media (max-width: 420px) {
    .adv-cnav-card { min-width: 110px; padding: 8px 10px; }
    .adv-cnav-card-title { font-size: 0.78em; }
    .adv-cnav-card-btn { padding: 3px 8px; font-size: 0.7em; }
}

/* ============================================
 * RECONCILIATION UI (.adv-recon-*)
 * ============================================ */
.adv-recon-wrap {
    padding: 12px 14px;
    border: 1px solid var(--adv-border, #e2e8f0);
    border-radius: 8px;
    background: var(--adv-bg-card, #f8fafc);
    font-size: 0.88em;
    line-height: 1.5;
}
.adv-recon-header {
    font-weight: 700;
    font-size: 0.95em;
    margin-bottom: 8px;
    padding-bottom: 6px;
    border-bottom: 1px solid var(--adv-border, #e2e8f0);
}
.adv-recon-pnl {
    padding: 6px 0;
    font-size: 0.92em;
}
.adv-recon-positive { color: var(--adv-positive, #16a34a); font-weight: 600; }
.adv-recon-negative { color: var(--color-negative, #ef4444); font-weight: 600; }
.adv-recon-section { margin: 8px 0; }
.adv-recon-section-title {
    font-weight: 600;
    font-size: 0.9em;
    margin-bottom: 4px;
}
.adv-recon-item {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 4px 8px;
    border-radius: 4px;
    gap: 8px;
}
.adv-recon-item:nth-child(even) {
    background: rgba(0, 0, 0, 0.02);
}
.adv-recon-sym { font-size: 0.9em; }
.adv-recon-status { font-size: 0.82em; white-space: nowrap; }
.adv-recon-unjournaled { color: #f59e0b; font-weight: 600; }
.adv-recon-qj-btn {
    padding: 2px 8px;
    font-size: 0.78em;
    border: 1px solid #f59e0b;
    border-radius: 4px;
    background: rgba(245, 158, 11, 0.08);
    color: #f59e0b;
    cursor: pointer;
    margin-left: 6px;
    font-weight: 600;
}
.adv-recon-qj-btn:hover {
    background: #f59e0b;
    color: #fff;
}
.adv-recon-empty {
    padding: 12px 0;
    text-align: center;
    color: var(--adv-text-muted, #94a3b8);
}
.adv-recon-footer {
    margin-top: 8px;
    padding-top: 6px;
    border-top: 1px solid var(--adv-border, #e2e8f0);
    font-size: 0.88em;
}
.adv-recon-done-btn {
    padding: 3px 10px;
    font-size: 0.82em;
    border: 1px solid var(--adv-positive, #16a34a);
    border-radius: 4px;
    background: rgba(22, 163, 106, 0.08);
    color: var(--adv-positive, #16a34a);
    cursor: pointer;
    margin-left: 8px;
    font-weight: 600;
}
.adv-recon-done-btn:hover {
    background: var(--adv-positive, #16a34a);
    color: #fff;
}
.adv-recon-done-btn:disabled {
    opacity: 0.6;
    cursor: default;
}

/* Dark mode reconciliation */
[data-theme="dark"] .adv-recon-wrap {
    background: rgba(30, 30, 50, 0.5);
    border-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .adv-recon-header { border-color: rgba(255, 255, 255, 0.08); }
[data-theme="dark"] .adv-recon-positive { color: #4ade80; }
[data-theme="dark"] .adv-recon-negative { color: #f87171; }
[data-theme="dark"] .adv-recon-item:nth-child(even) { background: rgba(255, 255, 255, 0.03); }
[data-theme="dark"] .adv-recon-unjournaled { color: #fbbf24; }
[data-theme="dark"] .adv-recon-qj-btn {
    border-color: #fbbf24;
    color: #fbbf24;
    background: rgba(251, 191, 36, 0.1);
}
[data-theme="dark"] .adv-recon-qj-btn:hover { background: #fbbf24; color: #1a1a2e; }
[data-theme="dark"] .adv-recon-footer { border-color: rgba(255, 255, 255, 0.08); }
[data-theme="dark"] .adv-recon-done-btn {
    border-color: #4ade80;
    color: #4ade80;
    background: rgba(74, 222, 128, 0.1);
}
[data-theme="dark"] .adv-recon-done-btn:hover { background: #4ade80; color: #1a1a2e; }

/* ============================================
 * WEEKLY SCORECARD UI (.adv-sc-*)
 * ============================================ */
.adv-sc-wrap {
    padding: 12px 14px;
    border: 1px solid var(--adv-border, #e2e8f0);
    border-radius: 8px;
    background: var(--adv-bg-card, #f8fafc);
    font-size: 0.88em;
    line-height: 1.5;
}
.adv-sc-header {
    font-weight: 700;
    font-size: 0.95em;
    margin-bottom: 10px;
    padding-bottom: 6px;
    border-bottom: 1px solid var(--adv-border, #e2e8f0);
}
.adv-sc-total {
    display: flex;
    align-items: baseline;
    gap: 6px;
    margin: 10px 0 14px;
    padding: 10px 14px;
    border-left: 4px solid #22c55e;
    background: rgba(34, 197, 94, 0.05);
    border-radius: 4px;
}
.adv-sc-total-num {
    font-size: 2em;
    font-weight: 800;
    line-height: 1;
}
.adv-sc-total-label {
    font-size: 0.92em;
    opacity: 0.7;
}
.adv-sc-row {
    display: grid;
    grid-template-columns: 110px 1fr 36px;
    align-items: center;
    gap: 8px;
    padding: 5px 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.04);
}
.adv-sc-row:last-child { border-bottom: none; }
.adv-sc-label {
    font-weight: 600;
    font-size: 0.9em;
    white-space: nowrap;
}
.adv-sc-bar-wrap {
    height: 8px;
    background: rgba(0, 0, 0, 0.06);
    border-radius: 4px;
    overflow: hidden;
}
.adv-sc-bar {
    height: 100%;
    border-radius: 4px;
    transition: width 0.5s ease;
}
.adv-sc-val {
    font-weight: 700;
    text-align: right;
    font-size: 0.92em;
}
.adv-sc-detail {
    grid-column: 1 / -1;
    font-size: 0.82em;
    opacity: 0.6;
    padding-left: 110px;
    margin-top: -3px;
}

/* Dark mode scorecard */
[data-theme="dark"] .adv-sc-wrap {
    background: rgba(30, 30, 50, 0.5);
    border-color: rgba(255, 255, 255, 0.08);
}
[data-theme="dark"] .adv-sc-header { border-color: rgba(255, 255, 255, 0.08); }
[data-theme="dark"] .adv-sc-total { background: rgba(34, 197, 94, 0.08); }
[data-theme="dark"] .adv-sc-bar-wrap { background: rgba(255, 255, 255, 0.06); }
[data-theme="dark"] .adv-sc-row { border-color: rgba(255, 255, 255, 0.04); }

/* Precheck result badges */
.adv-grade-pass { color: var(--adv-positive, #16a34a); font-weight: 600; }
.adv-grade-block { color: var(--color-negative, #ef4444); font-weight: 600; }
.adv-grade-warn { color: #f59e0b; font-weight: 600; }
.adv-precheck-entry .adv-journal-main { font-size: 0.88em; }

/* ============================================
 * SCRIPTED FLOW COMPONENTS (Arms — No AI)
 * ============================================ */

/* Choice buttons (MUA/BÁN, emotions, quiz A/B/C/D) */
.adv-scripted-choices {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 8px 40px;
    max-width: min(1200px, calc(100% - 40px));
    margin: 0 auto;
    width: 100%;
}

.adv-scripted-choice {
    padding: 8px 18px;
    background: transparent;
    border: 1.5px solid var(--adv-border, #e0e0e8);
    border-radius: 20px;
    color: var(--adv-text, #1a1a2e);
    cursor: pointer;
    font-size: 0.88em;
    font-weight: 500;
    transition: all 0.15s;
}

.adv-scripted-choice:hover {
    border-color: #f59e0b;
    background: rgba(245, 158, 11, 0.08);
    color: #f59e0b;
}

.adv-scripted-choice:active {
    background: #f59e0b;
    color: #fff;
    border-color: #f59e0b;
}

[data-theme="dark"] .adv-scripted-choice {
    border-color: rgba(245, 158, 11, 0.3);
    color: var(--adv-text, #e2e8f0);
}

[data-theme="dark"] .adv-scripted-choice:hover {
    background: rgba(245, 158, 11, 0.12);
    color: #fbbf24;
    border-color: #f59e0b;
}

/* ============================================
 * FLOW CONTROL BUTTONS (Back, Cancel)
 * ============================================ */

.adv-flow-controls {
    display: flex;
    gap: 8px;
    padding: 4px 40px;
    max-width: min(1200px, calc(100% - 40px));
    margin: 4px auto 0;
    width: 100%;
}

.adv-flow-btn {
    padding: 7px 16px;
    border-radius: 20px;
    font-size: 0.84em;
    font-weight: 500;
    cursor: pointer;
    transition: all 0.15s;
    border: 1.5px solid;
    background: transparent;
}

.adv-flow-back {
    border-color: var(--adv-border, #e0e0e8);
    color: var(--adv-text-secondary, #666);
}
.adv-flow-back:hover {
    border-color: var(--adv-accent, #6366f1);
    color: var(--adv-accent, #6366f1);
}

.adv-flow-cancel {
    border-color: var(--color-negative, #ef4444);
    color: var(--color-negative, #ef4444);
}
.adv-flow-cancel:hover {
    background: rgba(239, 68, 68, 0.08);
}

.adv-flow-confirm {
    background: var(--color-positive, #22c55e);
    border-color: var(--color-positive, #22c55e);
    color: #fff;
    font-weight: 600;
}
.adv-flow-confirm:hover {
    filter: brightness(1.1);
}

.adv-flow-edit {
    border-color: #f59e0b;
    color: #f59e0b;
}
.adv-flow-edit:hover {
    background: rgba(245, 158, 11, 0.08);
}

.adv-flow-restart {
    border-color: var(--color-negative, #ef4444);
    color: var(--color-negative, #ef4444);
}
.adv-flow-restart:hover {
    background: rgba(239, 68, 68, 0.08);
}

/* Summary action buttons container */
.adv-summary-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 8px 40px;
    max-width: min(1200px, calc(100% - 40px));
    margin: 0 auto;
    width: 100%;
}

/* Dark mode */
[data-theme="dark"] .adv-flow-back {
    border-color: rgba(255, 255, 255, 0.15);
    color: var(--adv-text-secondary, #94a3b8);
}
[data-theme="dark"] .adv-flow-back:hover {
    border-color: var(--adv-accent, #818cf8);
    color: var(--adv-accent, #818cf8);
}
[data-theme="dark"] .adv-flow-confirm {
    background: var(--color-positive, #16a34a);
    border-color: var(--color-positive, #16a34a);
}
[data-theme="dark"] .adv-flow-cancel,
[data-theme="dark"] .adv-flow-restart {
    border-color: rgba(239, 68, 68, 0.5);
}
[data-theme="dark"] .adv-flow-edit {
    border-color: rgba(245, 158, 11, 0.5);
}

/* Mobile responsive */
@media (max-width: 768px) {
    .adv-flow-controls,
    .adv-summary-actions {
        padding: 4px 12px;
    }
    .adv-flow-btn {
        padding: 6px 12px;
        font-size: 0.8em;
    }
    .adv-scripted-choices {
        padding: 6px 12px;
    }
}

/* ========================================
   Journal History — Interactive List
   ======================================== */
.adv-journal-list {
    font-size: 0.88em;
    line-height: 1.5;
}
.adv-journal-header {
    font-size: 1em;
    margin-bottom: 8px;
    padding-bottom: 6px;
    border-bottom: 1.5px solid var(--adv-border, #e0e0e8);
}
.adv-journal-toolbar {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 8px;
    padding: 4px 0;
}
.adv-journal-select-all {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: 0.88em;
    color: var(--adv-text-secondary, #666);
    cursor: pointer;
    user-select: none;
}
.adv-journal-cb {
    width: 16px;
    height: 16px;
    cursor: pointer;
    accent-color: var(--adv-accent, #6366f1);
}
.adv-journal-entry {
    display: flex;
    align-items: flex-start;
    gap: 8px;
    padding: 7px 4px;
    border-bottom: 1px solid var(--adv-border, rgba(0,0,0,0.06));
    border-radius: 4px;
    transition: background 0.12s;
}
.adv-journal-entry:hover {
    background: rgba(99, 102, 241, 0.04);
}
.adv-journal-entry .adv-journal-cb {
    margin-top: 2px;
    flex-shrink: 0;
}
.adv-journal-text {
    flex: 1;
    cursor: pointer;
    min-width: 0;
}
.adv-journal-text:hover {
    color: var(--adv-accent, #6366f1);
}
.adv-journal-main {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.adv-journal-thesis {
    font-size: 0.85em;
    color: var(--adv-text-secondary, #888);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.adv-journal-grade {
    font-weight: 600;
    min-width: 28px;
    text-align: center;
    padding-top: 2px;
    color: var(--adv-accent, #6366f1);
    flex-shrink: 0;
}
.adv-journal-trash {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 0.92em;
    opacity: 0.3;
    padding: 2px 4px;
    transition: opacity 0.15s;
    flex-shrink: 0;
}
.adv-journal-trash:hover {
    opacity: 1;
}
.adv-bulk-delete-btn {
    font-size: 0.82em !important;
    padding: 4px 12px !important;
}
.adv-bulk-delete-btn:disabled {
    opacity: 0.3;
    cursor: not-allowed;
}

/* Dark mode */
[data-theme="dark"] .adv-journal-header {
    border-bottom-color: rgba(255, 255, 255, 0.1);
}
[data-theme="dark"] .adv-journal-entry {
    border-bottom-color: rgba(255, 255, 255, 0.06);
}
[data-theme="dark"] .adv-journal-entry:hover {
    background: rgba(99, 102, 241, 0.08);
}
[data-theme="dark"] .adv-journal-thesis {
    color: var(--adv-text-secondary, #94a3b8);
}
[data-theme="dark"] .adv-journal-trash:hover {
    opacity: 1;
}

/* Mobile */
@media (max-width: 768px) {
    .adv-journal-entry {
        gap: 6px;
        padding: 6px 2px;
    }
    .adv-journal-main {
        font-size: 0.92em;
    }
}

/* =============================================
   FLOATING ADVISOR FAB & SLIDE-IN PANEL
   ============================================= */

/* FAB button — bottom-right corner */
.advisor-fab {
    position: fixed;
    bottom: 24px;
    right: 24px;
    z-index: 1000;
    display: flex;
    align-items: center;
    gap: 6px;
    background: var(--color-accent, #6366f1);
    color: #fff;
    border: none;
    border-radius: 50px;
    padding: 12px 20px;
    font-size: 14px;
    font-weight: 600;
    cursor: pointer;
    box-shadow: 0 4px 16px rgba(99, 102, 241, 0.35);
    transition: transform 0.2s, box-shadow 0.2s;
}
.advisor-fab:hover {
    transform: scale(1.05);
    box-shadow: 0 6px 20px rgba(99, 102, 241, 0.45);
}

/* Overlay behind panel */
.advisor-overlay {
    position: fixed;
    inset: 0;
    z-index: 1050;
    background: rgba(0, 0, 0, 0.3);
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s, visibility 0.3s;
}
.advisor-overlay.visible {
    opacity: 1;
    visibility: visible;
}

/* Slide-in panel */
.advisor-panel {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: 480px;
    min-width: 360px;
    max-width: 80vw;
    z-index: 1100;
    background: var(--color-bg, #fff);
    border-left: 1px solid var(--color-border, #e2e8f0);
    box-shadow: -4px 0 24px rgba(0, 0, 0, 0.12);
    transform: translateX(100%);
    transition: transform 0.3s ease;
    display: flex;
    flex-direction: column;
}
.advisor-panel.open {
    transform: translateX(0);
}
.advisor-panel.resizing {
    transition: none;
    user-select: none;
}

/* Resize handle — left edge drag strip */
.advisor-resize-handle {
    position: absolute;
    top: 0;
    left: -3px;
    width: 6px;
    height: 100%;
    cursor: col-resize;
    z-index: 1101;
    background: transparent;
    transition: background 0.15s;
}
.advisor-resize-handle:hover,
.advisor-resize-handle.active {
    background: var(--color-accent, #6366f1);
    opacity: 0.5;
}
.advisor-resize-handle::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 2px;
    height: 40px;
    border-radius: 2px;
    background: var(--color-text-muted, #94a3b8);
    opacity: 0;
    transition: opacity 0.15s;
}
.advisor-resize-handle:hover::after,
.advisor-resize-handle.active::after {
    opacity: 0.6;
}

.advisor-panel-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 16px;
    border-bottom: 1px solid var(--color-border, #e2e8f0);
    flex-shrink: 0;
}
.advisor-panel-title {
    font-size: 14px;
    font-weight: 700;
    color: var(--color-text, #1e293b);
}
.advisor-panel-close {
    background: none;
    border: none;
    font-size: 20px;
    cursor: pointer;
    color: var(--color-text-muted, #94a3b8);
    padding: 4px 8px;
    border-radius: 4px;
    transition: background 0.15s;
}
.advisor-panel-close:hover {
    background: var(--color-hover, rgba(0,0,0,0.05));
}

.advisor-panel-body {
    flex: 1;
    overflow-y: auto;
    overflow-x: hidden;
}

/* Adapt advisor page inside panel */
.advisor-panel-body .adv-page {
    height: 100%;
    min-height: 0;
}
.advisor-panel-body .adv-header {
    padding: 8px 12px;
}
.advisor-panel-body .adv-chat-area {
    padding: 8px;
}

/* Dark theme */
[data-theme="dark"] .advisor-fab {
    box-shadow: 0 4px 16px rgba(99, 102, 241, 0.25);
}
[data-theme="dark"] .advisor-overlay {
    background: rgba(0, 0, 0, 0.5);
}
[data-theme="dark"] .advisor-panel {
    box-shadow: -4px 0 24px rgba(0, 0, 0, 0.3);
}

/* Mobile: full-width panel, no resize */
@media (max-width: 768px) {
    .advisor-panel {
        width: 100vw;
        min-width: 100vw;
        max-width: 100vw;
    }
    .advisor-resize-handle {
        display: none;
    }
    .advisor-fab {
        padding: 10px 14px;
        font-size: 13px;
        bottom: 16px;
        right: 16px;
    }
    .advisor-fab-label {
        display: none;
    }
}