/* Theme Variables (User Provided) */
.theme-white {
    --bg: #ffffff;
    --text: #18181b;
    --ui: #f4f4f5;
    --accent: #4f46e5;
}

.theme-sepia {
    --bg: #f5f0e1;
    --text: #4e342e;
    --ui: #e8e2cd;
    --accent: #8d6e63;
}

.theme-dark {
    --bg: #18181b;
    --text: #d4d4d8;
    --ui: #27272a;
    --accent: #6366f1;
}

.theme-black {
    --bg: #000000;
    --text: #a1a1aa;
    --ui: #18181b;
    --accent: #52525b;
}

/* Apply Base Theme */
body,
.viewer-theme-root {
    background-color: var(--bg);
    color: var(--text);
    transition: background-color 0.3s, color 0.3s;
}

/* Vertical Viewer (Webtoon Scroll) */
.webtoon-scroll-safe {
    scroll-behavior: smooth;
    overscroll-behavior-y: contain;
    -webkit-overflow-scrolling: touch;
}

.webtoon-image-wrapper {
    position: relative;
    width: 100%;
    touch-action: pan-y;
    user-select: none;
    -webkit-user-select: none;
    -webkit-touch-callout: none;
}

.webtoon-image {
    display: block;
    width: 100%;
    height: auto;
    min-height: 200px;
    background: #f3f3f3;
    user-select: none;
    -webkit-user-drag: none;
    -webkit-touch-callout: none;
}

/* Horizontal Viewer (Comic Mode) */
.comic-mode-container {
    display: flex;
    flex-direction: row;
    overflow-x: auto;
    overflow-y: hidden;
    scroll-snap-type: x mandatory;
    scroll-behavior: smooth;
    height: 100vh;
    width: 100vw;
    background-color: #000;
    position: relative;
    z-index: 40;
    align-items: center;
    border: none;
}

.comic-mode-container.embedded {
    height: 100%;
    width: 100%;
}

.comic-image-wrapper {
    flex: 0 0 100%;
    height: 100%;
    width: 100%;
    scroll-snap-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    background: black;
    padding-top: 0;
    box-sizing: border-box;
    touch-action: pan-x pan-y;
}

.comic-image {
    height: 100%;
    width: auto;
    max-width: 100%;
    object-fit: contain;
    display: block;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.5);
    user-select: none;
    -webkit-user-select: none;
}

.comic-page-indicator {
    position: fixed;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(0, 0, 0, 0.6);
    backdrop-filter: blur(4px);
    color: white;
    padding: 6px 16px;
    border-radius: 999px;
    font-size: 13px;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    z-index: 60;
    pointer-events: none;
    transition: opacity 0.3s;
}

/* WebNovel Viewer Base Styles */
.novel-viewer-container {
    width: 100%;
    min-height: 100vh;
    transition: background-color 0.3s, color 0.3s;
}

.novel-content-area {
    font-variant-ligatures: none;
    word-break: break-all;
    overflow-wrap: break-word;
    /* Font family and size controlled by inline styles from settings */
}

/* [FIX] 2026-02-15 White Theme & Font Size Consistency Fix */
/* Force all text inside the reader body to inherit the theme color AND font-size */
/* This overrides inline styles like <span style="color: ...; font-size: ..."> */
#reader-body * {
    color: inherit !important;
    font-size: inherit !important;
    line-height: inherit !important;
    /* Ensure line-height is also consistent */
}