/* css/library.css — Библиотека „Моите документи" (/documents.html, issue #183).
   Ползва семантичните токени от base.css → dark mode работи автоматично.
   Реюзва account-btn / account-modal / account-loading от account.css. */

.library-container {
    max-width: 900px;
    padding-top: 2rem;
    padding-bottom: 3rem;
}

.library-header { margin: 0 0 1.5rem; }
.library-header h1 {
    font-size: 1.875rem;
    font-weight: 700;
    margin: 0 0 0.5rem;
    letter-spacing: -0.01em;
    color: var(--text);
}
.library-lead {
    color: var(--text-muted);
    margin: 0;
    line-height: 1.55;
    max-width: 62ch;
}

.library-shell {
    animation: account-fadein var(--t-base, 220ms) var(--ease-out, ease-out);
}

/* ---- Табове ------------------------------------------------------------- */

.lib-tabs {
    display: flex;
    gap: 0.25rem;
    border-bottom: 1px solid var(--border);
    margin-bottom: 1rem;
}
.lib-tab {
    appearance: none;
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    padding: 0.5rem 0.875rem;
    font: inherit;
    font-weight: 600;
    color: var(--text-secondary);
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
}
.lib-tab:hover { color: var(--text); }
.lib-tab-active {
    color: var(--primary);
    border-bottom-color: var(--primary);
}
.lib-tab-count {
    font-size: 0.75rem;
    font-weight: 700;
    background: var(--surface-alt);
    border: 1px solid var(--border);
    border-radius: 10px;
    padding: 0 0.45rem;
    color: var(--text-secondary);
}

/* ---- Toolbar: chips + търсене + сорт ------------------------------------ */

.lib-toolbar {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1rem;
    align-items: center;
    margin-bottom: 1rem;
}
.lib-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.375rem;
}
.lib-chip {
    appearance: none;
    font: inherit;
    font-size: 0.85rem;
    padding: 0.25rem 0.75rem;
    border-radius: 999px;
    border: 1px solid var(--border);
    background: var(--surface);
    color: var(--text-secondary);
    cursor: pointer;
    transition: border-color 0.2s, background 0.2s, color 0.2s;
}
.lib-chip:hover { border-color: var(--primary); color: var(--primary); }
.lib-chip-active {
    background: var(--primary);
    border-color: var(--primary);
    color: #fff;
}
.lib-chip-active:hover { color: #fff; }

.lib-toolbar-right {
    display: flex;
    gap: 0.5rem;
    margin-left: auto;
    flex: 1 1 260px;
    justify-content: flex-end;
}
.lib-search {
    flex: 1 1 160px;
    max-width: 260px;
    font: inherit;
    font-size: 0.9rem;
    padding: 0.4rem 0.75rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm, 0.5rem);
    background: var(--surface);
    color: var(--text);
    transition: border-color 0.2s;
}
.lib-search:focus { outline: none; border-color: var(--primary); }
.lib-sort {
    font: inherit;
    font-size: 0.9rem;
    padding: 0.4rem 0.5rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm, 0.5rem);
    background: var(--surface);
    color: var(--text);
}

.lib-trash-note {
    font-size: 0.875rem;
    color: var(--text-muted);
    background: var(--surface-alt);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm, 0.5rem);
    padding: 0.5rem 0.875rem;
    margin: 0 0 1rem;
}

/* ---- Списък ------------------------------------------------------------- */

.lib-list {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.lib-row {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    background: var(--surface);
    border: var(--card-border, 1px solid var(--border));
    border-radius: 0.75rem;
    padding: 0.75rem 1rem;
    box-shadow: var(--shadow-card, 0 1px 2px rgba(0, 0, 0, 0.04));
    transition: box-shadow 0.2s;
}
.lib-row:hover {
    box-shadow: var(--shadow-card-hover, 0 4px 12px -2px rgba(0, 0, 0, 0.08));
}

.lib-badge {
    flex: 0 0 auto;
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.03em;
    padding: 0.25rem 0.5rem;
    border-radius: 8px;
    min-width: 2.6rem;
    text-align: center;
}
.lib-badge-tp  { background: #dbeafe; color: #1e40af; }
.lib-badge-ksg { background: #dcfce7; color: #166534; }
.lib-badge-kss { background: #fef3c7; color: #92400e; }
.lib-badge-uca { background: #ede9fe; color: #5b21b6; }
[data-theme="dark"] .lib-badge-tp  { background: #1e3a5f; color: #93c5fd; }
[data-theme="dark"] .lib-badge-ksg { background: #14432a; color: #86efac; }
[data-theme="dark"] .lib-badge-kss { background: #45350c; color: #fcd34d; }
[data-theme="dark"] .lib-badge-uca { background: #372a63; color: #c4b5fd; }

.lib-row-main { flex: 1 1 auto; min-width: 0; }
.lib-row-name {
    font-weight: 600;
    color: var(--text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.lib-row-meta {
    font-size: 0.82rem;
    color: var(--text-muted);
    margin-top: 0.15rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.lib-status {
    font-weight: 600;
}
.lib-status-ready      { color: var(--success, #16a34a); }
.lib-status-processing { color: var(--primary, #2563eb); }
.lib-status-action     { color: var(--warning, #d97706); }
.lib-status-error      { color: var(--danger, #dc2626); }

.lib-row-actions {
    display: flex;
    align-items: center;
    gap: 0.375rem;
    flex: 0 0 auto;
}
.lib-row-actions .account-btn {
    padding: 0.35rem 0.75rem;
    font-size: 0.85rem;
}
.lib-icon-btn {
    appearance: none;
    background: none;
    border: 1px solid transparent;
    border-radius: var(--radius-sm, 0.5rem);
    font-size: 0.95rem;
    line-height: 1;
    padding: 0.35rem 0.4rem;
    cursor: pointer;
    opacity: 0.65;
    transition: opacity 0.2s, border-color 0.2s, background 0.2s;
}
.lib-icon-btn:hover {
    opacity: 1;
    background: var(--surface-alt);
    border-color: var(--border);
}
.lib-icon-btn-on { opacity: 1; }

/* ---- Празни състояния --------------------------------------------------- */

.lib-empty {
    text-align: center;
    padding: 3rem 1rem;
    color: var(--text-muted);
}
.lib-empty-icon { font-size: 2.25rem; margin-bottom: 0.75rem; }
.lib-empty h2 {
    font-size: 1.2rem;
    color: var(--text);
    margin: 0 0 0.5rem;
}
.lib-empty p { margin: 0 0 1rem; }
.lib-empty-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    justify-content: center;
}

/* ---- Карта „Моите документи" в /account.html (#183) ---------------------- */

.account-library-counts {
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem;
    margin-bottom: 0.75rem;
}
.account-library-count {
    font-size: 0.875rem;
    color: var(--text-secondary);
    background: var(--surface-alt);
    border: 1px solid var(--border);
    border-radius: 999px;
    padding: 0.25rem 0.75rem;
}
.account-library-count strong { color: var(--text); }
.account-library-none {
    font-size: 0.875rem;
    color: var(--text-muted);
}

/* ---- Линк „Виж всички в Библиотеката" под локалните истории (#183) ------- */

.lib-see-all {
    display: block;
    margin-top: 0.75rem;
    font-size: 0.875rem;
    text-align: center;
}
.lib-see-all--left {
    text-align: left;
    margin: 0 0 1rem;
}

/* ---- Mobile: карти под 640px (ux-patterns правилото) -------------------- */

@media (max-width: 640px) {
    .lib-row {
        flex-wrap: wrap;
        align-items: flex-start;
    }
    .lib-row-main { flex: 1 1 calc(100% - 4rem); }
    .lib-row-name { white-space: normal; }
    .lib-row-meta { white-space: normal; }
    .lib-row-actions {
        width: 100%;
        justify-content: flex-end;
        border-top: 1px solid var(--border-light, var(--border));
        padding-top: 0.5rem;
        margin-top: 0.25rem;
    }
    .lib-toolbar-right {
        flex: 1 1 100%;
        justify-content: stretch;
    }
    .lib-search { max-width: none; flex: 1 1 auto; }
}

/* ---- Lucide inline икони (една дизайн линия със стартовата, без емоджи) -- */

.account-tab-icon svg,
.auth-menu-icon svg,
.lib-tab-icon svg,
.lib-icon-btn svg {
    display: block;
}

/* Универсална обвивка за иконка в течащ текст/HTML низове (JS render-и) */
.li-ico {
    display: inline-block;
    vertical-align: -0.15em;
    line-height: 1;
}
.li-ico svg { display: inline-block; vertical-align: baseline; }

/* Класации (authorities „Топ изпълнители") — злато/сребро/бронз trophy */
.medal-1 { color: #d4af37; }
.medal-2 { color: #94a3b8; }
.medal-3 { color: #b45309; }

/* Икон контейнери, които вече получават SVG вместо емоджи */
.toast__icon svg,
.ob-icon svg,
.freq-icon svg,
.search-gate-icon svg,
.quota-indicator-icon svg,
.paywall-modal-icon svg,
.tp-phase__icon svg,
.tp-dropzone__icon svg,
.ksg-dropzone__icon svg,
.kssest-dropzone__icon svg,
.uca-file-icon svg {
    display: inline-block;
    vertical-align: middle;
}
.lib-tab-icon { line-height: 1; }
.lib-icon-btn { color: var(--text-secondary); }
.lib-icon-btn-on { color: var(--primary); }
.lib-pin-mark {
    display: inline-block;
    vertical-align: -2px;
    margin-right: 0.3rem;
    color: var(--primary);
}
.lib-pin-mark svg { width: 13px; height: 13px; }
.lib-empty-icon svg {
    display: inline-block;
    opacity: 0.55;
}

/* ---- Версии на документ (#184) ------------------------------------------- */

.lib-ver-badge {
    font-size: 0.72rem;
    font-weight: 700;
    padding: 0.1rem 0.5rem;
    border-radius: 999px;
    background: var(--surface-alt);
    border: 1px solid var(--border);
    color: var(--text-secondary);
    white-space: nowrap;
}
.lib-ver-badge-final {
    background: #dcfce7;
    border-color: #86efac;
    color: #166534;
}
[data-theme="dark"] .lib-ver-badge-final {
    background: #14432a;
    border-color: #166534;
    color: #86efac;
}
.lib-ver-hint {
    font-size: 0.78rem;
    color: var(--warning, #d97706);
    white-space: nowrap;
}

.lib-versions-modal { max-width: 560px; }

.lib-ver-note-hint {
    font-size: 0.875rem;
    color: var(--text-muted);
    background: var(--surface-alt);
    border: 1px solid var(--border);
    border-radius: var(--radius-sm, 0.5rem);
    padding: 0.5rem 0.875rem;
    margin: 0 0 0.875rem;
    line-height: 1.5;
}

.lib-ver-list {
    display: flex;
    flex-direction: column;
    gap: 0.375rem;
    margin-bottom: 1rem;
    max-height: 40vh;
    overflow-y: auto;
}
.lib-ver-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    border: 1px solid var(--border);
    border-radius: var(--radius-sm, 0.5rem);
    padding: 0.5rem 0.75rem;
    background: var(--surface);
}
.lib-ver-row-gen { background: var(--surface-alt); }
.lib-ver-main { flex: 1 1 auto; min-width: 0; }
.lib-ver-title {
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--text);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.lib-ver-meta {
    font-size: 0.78rem;
    color: var(--text-muted);
    margin-top: 0.1rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.lib-ver-actions {
    display: flex;
    align-items: center;
    gap: 0.3rem;
    flex: 0 0 auto;
}
.lib-ver-actions .account-btn {
    padding: 0.28rem 0.6rem;
    font-size: 0.8rem;
}

.lib-ver-upload-box {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
}
.lib-ver-drop {
    appearance: none;
    font: inherit;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
    width: 100%;
    border: 2px dashed var(--border);
    border-radius: var(--radius-sm, 0.5rem);
    background: var(--surface-alt);
    color: var(--text-secondary);
    padding: 1rem;
    cursor: pointer;
    transition: border-color 0.2s, color 0.2s;
}
.lib-ver-drop:hover,
.lib-ver-drop-over {
    border-color: var(--primary);
    color: var(--primary);
}
.lib-ver-drop-icon { line-height: 1; }
.lib-ver-drop-icon svg { display: inline-block; }
.lib-ver-drop-limits {
    font-size: 0.75rem;
    color: var(--text-muted);
}
.lib-ver-picked {
    font-size: 0.85rem;
    font-weight: 600;
    color: var(--text);
    margin: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

@media (max-width: 640px) {
    .lib-ver-row {
        flex-wrap: wrap;
        align-items: flex-start;
    }
    .lib-ver-title, .lib-ver-meta { white-space: normal; }
    .lib-ver-actions {
        width: 100%;
        justify-content: flex-end;
    }
    .lib-ver-hint { white-space: normal; }
}

/* ---- Reduced motion ------------------------------------------------------ */

@media (prefers-reduced-motion: reduce) {
    .library-shell { animation: none; }
    .lib-row, .lib-chip, .lib-icon-btn { transition: none; }
    .lib-ver-drop { transition: none; }
}

/* #185: Word коловозът и site-редакцията са се разминали */
.lib-ver-warn {
    margin: 0 0 0.75rem;
    padding: 0.6rem 0.9rem;
    border-radius: var(--radius-md);
    background: color-mix(in srgb, var(--warning) 12%, var(--surface));
    border: 1px solid color-mix(in srgb, var(--warning) 40%, var(--border));
    color: var(--text-primary);
    font-size: 0.88rem;
}
