/* Additional styles beyond style.css — loaded by wp_enqueue_style */

/* ══════════════════════════════════════════
   AUTHOR CHIP (inline avatar + name)
   ══════════════════════════════════════════ */
.author-chip {
    display: inline-flex; align-items: center; gap: 5px;
    color: var(--color-primary); text-decoration: none; vertical-align: middle;
}
.author-chip:hover { text-decoration: underline; }
.author-chip-avatar {
    border-radius: 50% !important;
    width: 20px !important; height: 20px !important;
    vertical-align: middle; flex-shrink: 0;
}

/* ══════════════════════════════════════════
   AUTHOR PROFILE PAGE
   ══════════════════════════════════════════ */
.author-profile-card {
    display: flex; gap: 20px; align-items: flex-start;
    background: var(--color-card);
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    padding: 24px; margin-bottom: 28px;
}
.author-avatar-lg img { border-radius: 50%; width: 96px; height: 96px; display: block; }
.author-profile-info { flex: 1; }
.author-profile-info h1 { font-size: 24px; margin-bottom: 6px; color: var(--color-text); }
.author-bio { color: var(--color-muted); font-size: 14px; margin-bottom: 14px; line-height: 1.6; }

.author-profile-stats { display: flex; gap: 28px; flex-wrap: wrap; }
.profile-stat { text-align: center; }
.profile-stat-value { display: block; font-size: 22px; font-weight: 700; color: var(--color-primary); }
.profile-stat-label { font-size: 12px; color: var(--color-muted); }

.profile-section { margin-bottom: 36px; }
.profile-section-title {
    font-size: 18px; font-weight: 700;
    border-bottom: 2px solid var(--color-primary);
    padding-bottom: 8px; margin-bottom: 16px;
    color: var(--color-text);
}

/* Answer items on profile page */
.profile-answer-item {
    background: var(--color-card);
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    padding: 14px 16px; margin-bottom: 10px;
}
.profile-answer-item.answer-accepted { border-left: 3px solid var(--color-accepted); }
.accepted-badge {
    display: inline-block; font-size: 12px; font-weight: 700;
    color: var(--color-accepted); margin-bottom: 6px;
}
.profile-answer-meta { display: flex; align-items: center; gap: 12px; margin-bottom: 6px; }
.profile-answer-votes { font-size: 13px; color: var(--color-muted); white-space: nowrap; }
.profile-answer-link {
    font-size: 15px; font-weight: 600; color: var(--color-primary);
    text-decoration: none;
}
.profile-answer-link:hover { text-decoration: underline; }
.profile-answer-excerpt { font-size: 14px; color: var(--color-text); line-height: 1.5; margin-bottom: 6px; }

@media (max-width: 600px) {
    .author-profile-card { flex-direction: column; }
    .author-avatar-lg img { width: 72px; height: 72px; }
    .author-profile-stats { gap: 16px; }
    .profile-stat-value { font-size: 18px; }
}

/* ── Prism-like code colours (no external dependency) ── */
pre { position: relative; }
code.lang-python  { color: #3572a5; }
code.lang-r       { color: #198ce7; }
code.lang-bash, code.lang-shell { color: #4eaa25; }

/* ── Syntax highlighting shim ── */
.hljs-keyword { color: #d73a49; }
.hljs-string  { color: #032f62; }
.hljs-comment { color: #6a737d; font-style: italic; }
.hljs-number  { color: #005cc5; }

/* ── Tag archive heading ── */
.taxonomy-title {
    font-size: 22px; font-weight: 700; padding: 12px 0;
    border-bottom: 2px solid var(--color-primary);
    margin-bottom: 12px; color: var(--color-text);
}

/* ── User profile card ── */
.user-card {
    background: var(--color-card);
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    padding: 20px; display: flex; gap: 16px; align-items: flex-start;
    margin-bottom: 16px;
}
.user-avatar img { border-radius: 50%; width: 72px; height: 72px; }
.user-info h2 { font-size: 20px; margin-bottom: 4px; }
.user-stats { display: flex; gap: 20px; margin-top: 8px; }
.user-stat { text-align: center; }
.user-stat-value { font-size: 18px; font-weight: 700; color: var(--color-primary); }
.user-stat-label { font-size: 12px; color: var(--color-muted); }

/* ── Loading spinner ── */
.spinner {
    display: inline-block; width: 16px; height: 16px;
    border: 2px solid var(--color-border);
    border-top-color: var(--color-primary);
    border-radius: 50%; animation: spin .6s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }

/* ── Toast notification ── */
.toast {
    position: fixed; bottom: 24px; right: 24px;
    background: var(--color-text); color: #fff;
    padding: 12px 20px; border-radius: var(--radius);
    font-size: 14px; z-index: 9999;
    animation: slideIn .2s ease-out;
}
@keyframes slideIn { from { transform: translateY(20px); opacity: 0; } to { transform: none; opacity: 1; } }

/* ══════════════════════════════════════════
   ASK PAGE
   ══════════════════════════════════════════ */
.ask-page-wrapper { max-width: 900px; margin: 0 auto; padding: 20px 20px 60px; }

/* Step containers */
.ask-step { display: block; }
#ask-step-2 { display: flex; gap: 24px; align-items: flex-start; }
@media (max-width: 720px) { #ask-step-2 { flex-direction: column; } .ask-tips { display: none; } }

/* Card shell */
.ask-card {
    background: var(--color-card);
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    overflow: hidden;
    flex: 1;
}
.ask-card-header {
    background: linear-gradient(135deg, #005fa3 0%, #0079d3 100%);
    color: #fff;
    padding: 24px 28px 20px;
}
.ask-card-header h1 { font-size: 22px; margin-bottom: 6px; }
.ask-subtitle { font-size: 14px; opacity: .88; line-height: 1.5; }
.ask-card-body { padding: 24px 28px; }

/* Title input on step 1 */
.ask-title-input {
    width: 100%; padding: 12px 16px;
    font-size: 16px;
    border: 2px solid var(--color-border);
    border-radius: var(--radius);
    transition: border-color .15s;
}
.ask-title-input:focus { outline: none; border-color: var(--color-primary); }

.char-count { font-size: 12px; color: var(--color-muted); text-align: right; margin-top: 4px; }

/* Label hint */
.label-hint {
    display: block;
    font-size: 12px; font-weight: 400;
    color: var(--color-muted);
    margin-bottom: 6px;
}
.form-group label { font-weight: 700; font-size: 15px; display: block; margin-bottom: 2px; }

/* Similar panel */
.ask-similar-panel {
    background: var(--color-card);
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    margin-top: 12px;
    overflow: hidden;
}
.ask-similar-header {
    padding: 12px 16px;
    background: var(--color-bg);
    border-bottom: 1px solid var(--color-border);
    font-weight: 700; font-size: 13px;
    color: var(--color-muted);
}
.ask-similar-item {
    padding: 12px 16px;
    border-bottom: 1px solid var(--color-border);
}
.ask-similar-item:last-child { border-bottom: none; }
.ask-similar-item a { font-size: 15px; font-weight: 600; color: var(--color-primary); display: block; margin-bottom: 4px; }
.ask-similar-item a:hover { text-decoration: underline; }
.ask-similar-meta { font-size: 12px; color: var(--color-muted); }
.ask-similar-footer {
    padding: 14px 16px;
    background: #f8f9fa;
    border-top: 1px solid var(--color-border);
    display: flex; align-items: center; justify-content: space-between;
    gap: 12px; flex-wrap: wrap;
    font-size: 13px; color: var(--color-muted);
}
.ask-no-results {
    background: var(--color-card);
    border: 1px solid var(--color-border);
    border-radius: var(--radius);
    padding: 20px 16px;
    margin-top: 12px;
    text-align: center;
}
.ask-no-results p { margin-bottom: 12px; color: var(--color-muted); }
.ask-spinner { padding: 20px; text-align: center; }

/* Back button */
.ask-back-btn {
    background: none; border: none;
    color: rgba(255,255,255,.8); cursor: pointer;
    font-size: 13px; padding: 0; margin-bottom: 8px;
    display: flex; align-items: center; gap: 4px;
}
.ask-back-btn:hover { color: #fff; }

/* Editor toolbar */
.editor-toolbar {
    display: flex; gap: 4px;
    padding: 6px 0 6px;
}
.toolbar-btn {
    background: var(--color-bg);
    border: 1px solid var(--color-border);
    border-radius: 3px;
    padding: 4px 10px; font-size: 13px;
    cursor: pointer; color: var(--color-text);
}
.toolbar-btn:hover { background: #e0e4e8; }

/* Textarea */
.ask-card-body textarea {
    width: 100%; padding: 12px;
    border: 2px solid var(--color-border);
    border-radius: var(--radius);
    font-family: var(--font-mono); font-size: 14px;
    line-height: 1.6; resize: vertical;
    transition: border-color .15s;
}
.ask-card-body textarea:focus { outline: none; border-color: var(--color-primary); }

/* Tags */
.ask-card-body input[type="text"] {
    width: 100%; padding: 10px 14px;
    border: 2px solid var(--color-border);
    border-radius: var(--radius); font-size: 14px;
    transition: border-color .15s;
}
.ask-card-body input[type="text"]:focus { outline: none; border-color: var(--color-primary); }
.tag-selected { background: var(--color-primary) !important; color: #fff !important; border-color: var(--color-primary) !important; }
.tag-clickable { cursor: pointer; }

/* Form footer */
.ask-form-footer { margin-top: 20px; }
.btn-lg { padding: 12px 28px; font-size: 16px; }
.ask-notice { margin-top: 10px; font-size: 14px; }

/* Tips sidebar */
.ask-tips { width: 260px; min-width: 220px; flex-shrink: 0; }
.ask-tips-list { list-style: none; padding: 0; }
.ask-tips-list li {
    padding: 6px 0;
    border-bottom: 1px solid var(--color-border);
    font-size: 13px; line-height: 1.5;
    padding-left: 20px; position: relative;
}
.ask-tips-list li::before { content: '✓'; position: absolute; left: 0; color: var(--color-accepted); font-weight: 700; }
.ask-tips-list li:last-child { border-bottom: none; }

/* ── Responsive tweaks ── */
@media (max-width: 480px) {
    .header-inner { padding: 0 12px; }
    .header-actions .btn-outline { display: none; }
    .sort-bar { gap: 4px; }
    .sort-bar a { padding: 6px 8px; font-size: 12px; }
    .question-full .vote-col { width: 36px; min-width: 36px; }
}