/* ============================================================================
   spellbook-sleek.css — trims the Spell Book's weight
   ----------------------------------------------------------------------------
   The history and spell entries had accumulated a lot of body: 14px radii,
   20-24px padding, heavy glows, lift-on-hover and per-item backdrop blurs.
   Stacked ten deep that reads as a pile of bubbles rather than a list.

   This pass keeps the palette exactly — teal #7bc9a6 for runes, violet
   #a78bfa for stats, cyan for speeds — and only takes away thickness: smaller
   radii, tighter padding, hairline separators instead of full borders, and
   no transform on hover. Loaded after the components sheet so it can trim
   without editing the originals.
   ========================================================================== */

/* ── list rhythm ──────────────────────────────────────────────────────── */
#spellbookPage .casting-history-list,
#spellbookPage .prepared-spells-list {
    gap: 6px;
}

/* ── entries: a row, not a card ───────────────────────────────────────── */
#spellbookPage .history-entry-compact,
#spellbookPage .spell-entry {
    padding: 12px 14px;
    border-radius: 8px;
    /* one hairline instead of a full box — the list reads as a list */
    border: none;
    border-bottom: 1px solid rgba(167, 139, 250, 0.16);
    background: rgba(16, 15, 24, 0.5);
    /* per-item blur is expensive and invisible under an opaque fill */
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    transition: background 0.18s ease, border-color 0.18s ease;
}
#spellbookPage .history-entry-compact:hover,
#spellbookPage .spell-entry:hover {
    background: rgba(24, 22, 36, 0.7);
    border-bottom-color: rgba(167, 139, 250, 0.4);
    box-shadow: none;
    /* no lift: ten of these bobbing on hover is noise */
    transform: none;
}

#spellbookPage .history-compact-main {
    gap: 16px;
}

/* ── rune line: still teal, just not shouting ─────────────────────────── */
#spellbookPage .history-runes-display {
    font-size: 1rem;
    line-height: 1.4;
    text-shadow: none;
}
#spellbookPage .history-timestamp {
    font-size: 0.7rem;
}

/* ── stat pills: inline figures, not buttons ──────────────────────────── */
#spellbookPage .history-stat-pill {
    gap: 2px;
    padding: 4px 10px;
    min-width: 0;
    background: transparent;
    border: none;
    border-left: 2px solid rgba(167, 139, 250, 0.35);
    border-radius: 0;
    transition: border-color 0.18s ease;
}
#spellbookPage .history-stat-pill:hover {
    background: transparent;
    border-left-color: rgba(167, 139, 250, 0.7);
    transform: none;
    box-shadow: none;
}
#spellbookPage .history-stat-pill .pill-label {
    font-size: 0.6rem;
    letter-spacing: 0.06em;
    opacity: 0.8;
}
#spellbookPage .history-stat-pill .pill-value {
    font-size: 1.05rem;
    text-shadow: none;
}
/* the underline sweep in spellbook_polish belongs on a control, not a figure */
#spellbookPage .history-stat-pill::after { display: none; }

/* ── actions: quieter, same colours ───────────────────────────────────── */
#spellbookPage .history-action-btn,
#spellbookPage .spell-action-btn {
    padding: 5px 11px;
    border-radius: 7px;
    font-size: 0.75rem;
    box-shadow: none;
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
    transition: background 0.18s ease, border-color 0.18s ease;
}
#spellbookPage .history-action-btn:hover,
#spellbookPage .spell-action-btn:hover {
    transform: none;
    box-shadow: none;
}

/* ── section headers ──────────────────────────────────────────────────── */
#spellbookPage .section-label,
#spellbookPage .spellbook-section-title {
    font-size: 0.7rem;
    letter-spacing: 0.1em;
}

/* Entries arrive one after another; a 10px slide on each is a lot of motion
   in a long list. Fade only. */
#spellbookPage .history-entry-compact,
#spellbookPage .spell-entry {
    animation: sleekFade 0.22s ease forwards;
}
@keyframes sleekFade {
    from { opacity: 0; }
    to   { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
    #spellbookPage .history-entry-compact,
    #spellbookPage .spell-entry { animation: none; }
}

@media (max-width: 600px) {
    #spellbookPage .history-entry-compact,
    #spellbookPage .spell-entry { padding: 10px 11px; }
    #spellbookPage .history-compact-main { gap: 10px; }
    #spellbookPage .history-runes-display { font-size: 0.92rem; }
    #spellbookPage .history-stat-pill { padding: 3px 8px; }
}
