/* Hand-written additions on top of the site's own compiled Tailwind/DaisyUI
   build (tailwind.min.css), which is purged to only the classes that already
   existed in the saved page. Anything new the clone needs lives here instead
   of guessing at utility class names that may have been purged away. */

/* Back-to-top button, fixed bottom-right, toggled visible via JS on scroll */
.wc-back-to-top {
    position: fixed;
    right: 1.25rem;
    bottom: 1.25rem;
    width: 2.75rem;
    height: 2.75rem;
    border-radius: 999px;
    background: #2C2D31;
    color: #fff;
    border: 1px solid rgba(255,255,255,0.15);
    box-shadow: 0 8px 24px rgba(0,0,0,0.45);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    opacity: 0;
    pointer-events: none;
    transform: translateY(8px);
    transition: opacity 0.2s ease, transform 0.2s ease;
    z-index: 40;
}
.wc-back-to-top.wc-back-to-top-show {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}
.wc-back-to-top:hover { background: #393A3F; }

/* Quick search dropdown */
.wc-search-wrap {
    position: absolute;
    top: calc(100% + 0.25rem);
    left: 0;
    width: 100%;
    z-index: 30;
}

.wc-search-panel {
    background: var(--color-base-100, #1E1F22);
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 0.5rem;
    box-shadow: 0 12px 28px rgba(0,0,0,0.45);
    overflow: hidden;
    max-height: 60vh;
    overflow-y: auto;
}

.wc-search-item {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 0.5rem 0.75rem;
    text-decoration: none;
    color: inherit;
}
.wc-search-item:hover { background: var(--color-base-300, #393A3F); }

.wc-search-thumb {
    width: 2.25rem;
    height: 3rem;
    flex: none;
    object-fit: cover;
    border-radius: 0.25rem;
    background: #2C2D31;
}

.wc-search-thumb-empty {
    width: 2.25rem;
    height: 3rem;
    flex: none;
    border-radius: 0.25rem;
    background: #2C2D31;
}

.wc-search-title {
    flex: 1;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.wc-search-empty,
.wc-search-hint {
    padding: 0.75rem 1rem;
    opacity: 0.7;
    font-size: 0.9rem;
}

/* Latest Updates card layout + 1/2 column preference */
.wc-latest-card .wc-cover { width: 30%; }
.wc-latest-card .wc-info { width: 70%; }

#latest-updates-grid.wc-mode-1 {
    grid-template-columns: 1fr !important;
}
@media (min-width: 640px) {
    #latest-updates-grid.wc-mode-1 .wc-cover { width: 20%; }
    #latest-updates-grid.wc-mode-1 .wc-info { width: 80%; }
}
@media (min-width: 768px) {
    #latest-updates-grid.wc-mode-1 .wc-cover { width: 15%; }
    #latest-updates-grid.wc-mode-1 .wc-info { width: 85%; }
}

/* Hot Series active check marker */
.wc-sort-check.hidden { display: none; }

/* A few layout primitives for the new local pages (series/search/chat/contact/
   privacy/faq). The site's own tailwind.min.css is purged to only the utility
   classes its real templates use, so hand-rolled equivalents live here rather
   than guessing at utilities (max-w-3xl, w-40, border-t, etc.) that never
   made it into the build. */
.wc-narrow { max-width: 48rem; }
.wc-cover-md { width: 10rem; max-width: 60%; }
.wc-flex-none { flex: none; }
.wc-divider-top { border-top: 1px solid rgba(100, 116, 139, 0.5); }

/* Toast used for "View More" / info notices */
#wc-toast {
    position: fixed;
    left: 50%;
    bottom: 1.5rem;
    transform: translate(-50%, 8px);
    background: #26272b;
    color: #f2f2f2;
    border: 1px solid rgba(255,255,255,0.12);
    border-radius: 0.5rem;
    padding: 0.65rem 1.1rem;
    font-size: 0.9rem;
    box-shadow: 0 10px 30px rgba(0,0,0,0.5);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.2s ease, transform 0.2s ease;
    z-index: 50;
    max-width: 90vw;
    text-align: center;
}
#wc-toast.wc-toast-show {
    opacity: 1;
    transform: translate(-50%, 0);
}

/* History rows rendered client-side */
.wc-history-row {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}
.wc-history-row img {
    width: 2.25rem;
    height: 3rem;
    object-fit: cover;
    border-radius: 0.25rem;
    flex: none;
}
.wc-history-title { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
