/* ============================================
   E-HENTAI INSPIRED GLOBAL STYLES
   ============================================ */
html, html.theme-blue, html.theme-black {
    --eh-bg: #e3e0d1;
    --eh-bg-alt: #edebdf;
    --eh-header-bg: #4f5960;
    --eh-text: #5c0d12;
    --eh-text-sec: #34353b;
    --eh-link: #034da0;
    --eh-link-hover: #0670c0;
    --eh-border: #b5a4a4;
    --eh-border-light: #d2cfc6;
    --eh-row-even: #edebdf;
    --eh-row-odd: #e3e0d1;
    --eh-row-hover: #d6d3c4;
    --eh-input-bg: #f7f6f2;
}

body, html {
    font-family: Verdana, Geneva, Arial, sans-serif !important;
    font-size: 12px !important;
    background-color: var(--eh-bg) !important;
    color: var(--eh-text) !important;
    margin: 0;
    text-align: left !important;
}

a { color: var(--eh-link) !important; text-decoration: none; }
a:hover { color: var(--eh-link-hover) !important; text-decoration: underline; }

/* ===== HIDE OLD NAV / BARS ===== */
nav[role="navigation"], .notification-top-bar { display: none !important; }

/* ===== TOP BAR (all pages) ===== */
.hp-nb {
    background: #4f535b;
    border-bottom: 1px solid #3a3d42;
    padding: 7px 0;
}
.hp-nb-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 16px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}
.hp-nb-left, .hp-nb-right {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 1px;
}
.hp-nb a {
    color: #f1f1f1 !important;
    font-size: 12px;
    padding: 3px 7px;
    text-decoration: none !important;
}
.hp-nb a:hover { color: #fff !important; text-decoration: underline !important; }
.hp-nb .nb-sep {
    color: #999;
    font-size: 11px;
    margin: 0 1px;
    user-select: none;
}

/* ===== HEADER BANNER (homepage only) ===== */
.hp-hd {
    background: linear-gradient(to bottom, #E3E0D1 0%, #d6d3c4 100%);
    border-bottom: 2px solid #B5A789;
    text-align: center;
    padding: 30px 12px 22px;
}
.hp-hd-title {
    font-size: 22px;
    font-weight: bold;
    color: #5C0D12 !important;
    display: block;
    margin-bottom: 5px;
    text-decoration: none !important;
}
.hp-hd-title:hover { color: #5C0D12 !important; text-decoration: none !important; }
.hp-hd-sub {
    font-size: 11px;
    color: #7a6e57;
    font-style: italic;
}

/* Auth links wrapper (for responsive hiding) */
.nb-auth-links {
    display: inline-flex;
    align-items: center;
    gap: 1px;
}

/* Inline search in top bar (non-homepage) */
.nb-search {
    display: flex;
    align-items: center;
    gap: 0;
    margin-left: auto;
    flex-shrink: 1;
    min-width: 0;
}
.nb-search input[type="text"] {
    width: 200px;
    max-width: 100%;
    padding: 3px 8px;
    font-size: 11px;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    border: 1px solid #6a6d73;
    border-right: none;
    border-radius: 3px 0 0 3px;
    background: #3a3d42;
    color: #e8e8e8;
    outline: none;
}
.nb-search input[type="text"]:focus {
    background: #33363b;
    border-color: #888;
}
.nb-search input[type="text"]::placeholder { color: #999; }
.nb-search button {
    padding: 3px 10px;
    font-size: 11px;
    font-family: Verdana, Geneva, Tahoma, sans-serif;
    background: #6a6d73;
    color: #e8e8e8;
    border: 1px solid #6a6d73;
    border-radius: 0 3px 3px 0;
    cursor: pointer;
    white-space: nowrap;
    line-height: 1.35;
}
.nb-search button:hover { background: #7a7d83; }

/* Separator between search and auth (hide on mobile) */
.nb-search-sep { color: #999; font-size: 11px; margin: 0 1px; user-select: none; }

@media (max-width: 768px) {
    .hp-nb-right .nb-auth-links,
    .hp-nb-right .nb-search-sep { display: none; }
    .hp-nb-right { width: 100%; margin-top: 6px; }
    .nb-search { width: 100%; }
    .nb-search input[type="text"] { width: 100%; flex: 1; padding: 6px 10px; font-size: 13px; }
    .nb-search button { padding: 6px 14px; font-size: 13px; }
    .hp-hd { padding: 20px 10px 16px; }
    .hp-hd-title { font-size: 17px; }
}
@media (max-width: 480px) {
    .hp-nb-left a { padding: 3px 4px; font-size: 11px; }
    .hp-nb .nb-sep { margin: 0; }
}

/* ===== FOOTER ===== */
.eh-footer {
    background: var(--eh-header-bg);
    border-top: 3px solid #3a4046;
    padding: 10px 0;
    margin-top: 15px;
    text-align: center;
}
.eh-footer-inner { max-width: 1200px; margin: 0 auto; padding: 0 10px; }
.eh-footer-links { list-style: none; padding: 0; margin: 0 0 6px; display: inline; }
.eh-footer-links li { display: inline; }
.eh-footer-links li:not(:last-child)::after { content: " | "; color: #777; font-size: 11px; }
.eh-footer-links li a { color: #bcc3c7 !important; font-size: 11px; text-decoration: none !important; }
.eh-footer-links li a:hover { color: #fff !important; text-decoration: underline !important; }
.eh-footer-copy { color: #888; font-size: 10px; margin: 4px 0 0; }

/* ===== CONTENT ===== */
#content { max-width: 1200px; margin: 0 auto; padding: 0 10px; }
#messages { max-width: 1200px; margin: 0 auto; }

.container {
    background-color: var(--eh-bg-alt) !important;
    border: 1px solid var(--eh-border-light);
    border-radius: 3px;
}

.color-icon { color: #5c0d12; }

/* ===== CONTENT PAGES (tags, artists, results, etc.) ===== */
#content h1, #content h2, #content h3 {
    color: var(--eh-text) !important;
}
#content .type { color: var(--eh-text-sec); }
#content .count { color: #666; font-size: 11px; font-weight: 400; }

/* ===== TAG LISTING PAGES ===== */

/* Page title */
.tag-page-header { padding: 20px 0 12px; }
.tag-page-title {
    font-size: 22px;
    font-weight: 700;
    color: var(--eh-text) !important;
    margin: 0;
}

/* Alphabetical navigation */
.alpha-nav {
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
    padding: 12px 15px;
    margin-bottom: 0;
    background: var(--eh-bg-alt);
    border: 1px solid var(--eh-border);
    border-bottom: none;
}
.alpha-nav a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 28px;
    height: 28px;
    padding: 0 8px;
    font-size: 12px;
    font-weight: 700;
    background: #676057;
    border: 1px solid var(--eh-border);
    border-radius: 4px;
    color: #fff !important;
    text-decoration: none !important;
    transition: all 0.15s;
}
.alpha-nav a:hover {
    background: #5c7da0 !important;
    color: #fff !important;
    border-color: #4a6a8a;
    text-decoration: none !important;
}
.alpha-nav a.current {
    background: #5c7da0;
    color: #fff !important;
    border-color: #4a6a8a;
}

/* Tag container */
.tag-container {
    padding: 15px 20px;
    background: var(--eh-bg-alt);
    border: 1px solid var(--eh-border);
}

/* Letter section */
.tag-section { margin-bottom: 18px; }
.tag-section:last-child { margin-bottom: 0; }
.tag-section-letter {
    font-size: 18px;
    font-weight: 700;
    color: var(--eh-text) !important;
    padding: 4px 0 6px;
    margin-bottom: 10px;
    border-bottom: 1px solid var(--eh-border-light);
}

/* Tag list - column layout */
.tag-list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0;
}
.tag-list-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 4px 10px;
    text-decoration: none !important;
    border: 1px solid var(--eh-border);
    border-radius: 4px;
    margin: 2px;
    background: var(--eh-input-bg);
    transition: background 0.12s;
}
.tag-list-item:hover {
    background: var(--eh-row-hover);
    text-decoration: none !important;
}
.tag-list-item .tp-name {
    color: #625342 !important;
    font-size: 12px;
    font-weight: 600;
    text-decoration: none !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.tag-list-item:hover .tp-name {
    color: var(--eh-link-hover) !important;
    text-decoration: underline !important;
}
.tag-list-item .tp-count {
    color: #888 !important;
    font-size: 11px;
    font-weight: 400;
    margin-left: 8px;
    flex-shrink: 0;
}

/* Tag page pagination */
.tag-pager {
    text-align: center;
    padding: 12px 0;
    margin-top: 10px;
}
.tag-pager .tp-row {
    display: inline-flex;
    align-items: center;
    gap: 0;
    flex-wrap: wrap;
    justify-content: center;
}
.tag-pager a, .tag-pager span.tp-btn {
    display: inline-block;
    padding: 6px 14px;
    font-size: 12px;
    color: #fff !important;
    text-decoration: none !important;
    border: 1px solid var(--eh-border);
    border-right: none;
    background: #676057;
    cursor: pointer;
    font-weight: 600;
}
.tag-pager .tp-row > *:last-child { border-right: 1px solid var(--eh-border); }
.tag-pager a:hover { background: var(--eh-row-hover); text-decoration: none !important; }
.tag-pager span.tp-current {
    display: inline-block;
    padding: 6px 14px;
    font-size: 12px;
    background: #5c7da0;
    color: #fff !important;
    font-weight: 700;
    border: 1px solid #4a6a8a;
    border-right: none;
    cursor: default;
}
.tag-pager span.tp-disabled {
    display: inline-block;
    padding: 6px 14px;
    font-size: 12px;
    border: 1px solid var(--eh-border-light);
    border-right: none;
    background: var(--eh-bg);
    color: #aaa !important;
    cursor: default;
}

@media (max-width: 900px) {
    .tag-list { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 768px) {
    .tag-page-title { font-size: 18px; }
    .alpha-nav { gap: 3px; padding: 10px 12px; }
    .alpha-nav a { min-width: 24px; height: 24px; font-size: 11px; padding: 0 5px; }
    .tag-container { padding: 12px 14px; }
    .tag-section-letter { font-size: 15px; }
    .tag-list-item .tp-name { font-size: 11px; }
    .tag-list-item .tp-count { font-size: 10px; }
}
@media (max-width: 500px) {
    .tag-page-title { font-size: 16px; }
    .alpha-nav a { min-width: 22px; height: 22px; font-size: 10px; }
    .tag-list { grid-template-columns: 1fr; }
    .tag-list-item .tp-name { font-size: 11px; }
    .tag-list-item .tp-count { font-size: 10px; }
}

/* Gallery grid on results/search/favorites pages */
.index-container .gallery .caption {
    background-color: #665b4d !important;
    color: #d9d9d9 !important;
}

/* Caption style for thumbnail mode */
html.theme-blue .caption,
.caption {
    background-color: #665b4d;
    color: #d9d9d9;
}

/* ===== PAGINATION - E-HENTAI STYLE ===== */
.eh-pager {
    max-width: 1200px;
    margin: 8px auto;
    text-align: center;
    padding: 4px 0;
    background: var(--eh-bg-alt);
    border: 1px solid var(--eh-border);
}
.eh-pager .p-row {
    display: inline-flex;
    align-items: center;
    gap: 0;
    flex-wrap: wrap;
    justify-content: center;
}
.eh-pager a, .eh-pager span.p-btn {
    display: inline-block;
    padding: 3px 12px;
    font-size: 12px;
    color: var(--eh-text) !important;
    text-decoration: none !important;
    border: 1px solid var(--eh-border);
    border-right: none;
    background: var(--eh-input-bg);
    cursor: pointer;
    line-height: 1.5;
}
.eh-pager .p-row > *:last-child { border-right: 1px solid var(--eh-border); }
.eh-pager a:hover { background: var(--eh-row-hover); text-decoration: none !important; }
.eh-pager span.p-current {
    display: inline-block;
    padding: 3px 12px;
    font-size: 12px;
    line-height: 1.5;
    background: #5c7da0;
    color: #fff !important;
    font-weight: 700;
    border: 1px solid #4a6a8a;
    border-right: none;
    cursor: default;
}
.eh-pager span.p-dots {
    display: inline-block;
    padding: 3px 8px;
    font-size: 12px;
    line-height: 1.5;
    background: var(--eh-bg-alt);
    border: 1px solid var(--eh-border-light);
    border-right: none;
    cursor: default;
    color: #999 !important;
}
.eh-pager span.p-disabled {
    display: inline-block;
    padding: 3px 12px;
    font-size: 12px;
    line-height: 1.5;
    border: 1px solid var(--eh-border-light);
    border-right: none;
    background: var(--eh-bg);
    color: #aaa !important;
    cursor: default;
}

/* Gallery table (list view) - shared */
.eh-gallery-table {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
    border-collapse: collapse;
    border: 1px solid var(--eh-border);
    font-size: 12px;
    background: var(--eh-bg-alt);
}
.eh-gallery-table tr { border-bottom: 1px solid var(--eh-border-light); }
.eh-gallery-table tr:nth-child(odd) { background: var(--eh-row-odd); }
.eh-gallery-table tr:nth-child(even) { background: var(--eh-row-even); }
.eh-gallery-table tr:hover { background: var(--eh-row-hover); }
.eh-gallery-table td {
    padding: 4px 6px;
    vertical-align: middle;
    text-align: left;
    border-right: 1px solid var(--eh-border-light);
}
.eh-gallery-table td:last-child { border-right: none; }

.eh-td-thumb { width: 70px; text-align: center; padding: 3px !important; }
.eh-td-thumb a { display: block; }
.eh-td-thumb img { width: 65px; height: 93px; object-fit: cover; border: 1px solid var(--eh-border); display: block; margin: 0 auto; }

.eh-td-cat { width: 80px; text-align: center; padding: 0 4px !important; }
.eh-badge { display: inline-block; padding: 3px 6px; border-radius: 2px; font-size: 10px; font-weight: 700; color: #fff; white-space: nowrap; min-width: 62px; text-align: center; }

.eh-td-info { padding: 6px 10px !important; text-align: left !important; }
.eh-g-title { font-size: 12px; font-weight: 700; display: inline; color: var(--eh-text) !important; line-height: 1.5; text-decoration: none !important; text-align: left; position: relative; }
.eh-g-title:hover { text-decoration: underline !important; }

.eh-g-tags { display: flex; flex-wrap: wrap; gap: 3px; justify-content: flex-start; text-align: left; margin-top: 4px; }
.eh-tag-pill { display: inline-block; padding: 1px 5px; font-size: 10px; border: 1px solid var(--eh-border); border-radius: 2px; background: var(--eh-bg); color: var(--eh-text-sec) !important; text-decoration: none !important; white-space: nowrap; }
.eh-tag-pill:hover { background: var(--eh-row-hover); text-decoration: none !important; }
.eh-tag-lang { background: #4a7c59 !important; border-color: #3a6a49 !important; color: #fff !important; }
.eh-tag-lang:hover { background: #5a8c69 !important; }
.eh-tag-artist { border-color: #9e6a20 !important; color: #9e6a20 !important; }

.eh-td-date, .eh-td-pages, .eh-td-favs {
    vertical-align: middle;
    text-align: center !important;
    font-size: 11px;
    color: var(--eh-text-sec);
    white-space: nowrap;
    padding: 4px 8px !important;
}
.eh-td-date { width: 120px; }
.eh-td-pages { width: 50px; }
.eh-td-favs { width: 50px; color: #c00; }

/* Hover Image Preview */
.eh-hover-preview {
    display: none;
    position: fixed;
    z-index: 9999;
    pointer-events: none;
    border: 2px solid #666;
    background: #fff;
    box-shadow: 0 4px 20px rgba(0,0,0,0.4);
    padding: 2px;
}
.eh-hover-preview img { display: block; max-width: 300px; max-height: 430px; width: auto; height: auto; }

/* Grid view (thumbnail mode) - shared */
.eh-grid-view {
    max-width: 1200px;
    margin: 0 auto;
    display: none;
    background: var(--eh-bg-alt);
    border: 1px solid var(--eh-border);
    padding: 10px;
    text-align: center;
}
.eh-grid-view.active { display: block; }
.eh-grid-view .caption { background-color: #665b4d !important; color: #d9d9d9 !important; }

.eh-table-wrap { display: block; }
.eh-table-wrap.hidden { display: none; }

/* Category badge colors */
.cat-doujinshi  { background: #9e2720; }
.cat-manga      { background: #db6c24; }
.cat-artistcg   { background: #d5a930; }
.cat-gamecg     { background: #446f2c; }
.cat-western    { background: #8b7c6b; }
.cat-non-h      { background: #5fa9cf; }
.cat-imageset   { background: #325ca2; }
.cat-cosplay    { background: #6a32a2; }
.cat-asianporn  { background: #a23282; }
.cat-misc       { background: #777; }
.cat-default    { background: #555; }

/* ===== Responsive ===== */
@media (max-width: 768px) {
    .eh-td-date, .eh-td-pages, .eh-td-favs { display: none; }
    .eh-td-thumb { width: 55px; }
    .eh-td-thumb img { width: 50px; height: 72px; }
    .eh-td-cat { width: 60px; }
    .eh-badge { font-size: 9px; min-width: 50px; padding: 2px 4px; }
    .eh-g-tags { gap: 2px; }
    .eh-tag-pill { font-size: 9px; padding: 1px 3px; }
}
@media (max-width: 500px) {
    .eh-td-cat { display: none; }
    .eh-g-tags { gap: 2px; }
    .eh-tag-pill { font-size: 9px; }
    .eh-g-title { font-size: 11px; }
}

/* Hide old Laravel pagination on listing pages (not the reader pagination) */
.pagination:not(#pagination-page-top):not(#pagination-page-bottom) { display: none !important; }