/* Pixiv 作品縮圖格與預覽視窗（wwwroot/js/pixiv-works.js），收藏頁與追蹤頁共用 */
.pixiv-work-thumb { aspect-ratio: 1 / 1; cursor: pointer; overflow: hidden; position: relative; }
.pixiv-work-thumb img { width: 100%; height: 100%; object-fit: cover; }
.pixiv-work-badges { position: absolute; top: .25rem; left: .25rem; right: .25rem; display: flex; justify-content: space-between; pointer-events: none; }
.pixiv-ellipsis { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }

/* 預覽圖縮放到視窗內；點一下放大成原圖原尺寸，在框內捲動 */
.pixiv-viewer-image { display: block; margin: 0 auto; max-width: 100%; max-height: 80vh; height: auto; cursor: zoom-in; }
.pixiv-viewer-frame.zoomed { overflow: auto; max-height: 80vh; }
.pixiv-viewer-frame.zoomed .pixiv-viewer-image { max-width: none; max-height: none; cursor: grab; }
.pixiv-viewer-frame.dragging .pixiv-viewer-image { cursor: grabbing; }

/* 上一張／下一張固定在左右兩側（預覽視窗與 Pixiv 隨機頁共用）；預覽視窗在寬螢幕時放在視窗外面，不擋住圖片 */
.pixiv-viewer-dialog { position: relative; }
.pixiv-viewer-arrow { position: absolute; top: 50%; transform: translateY(-50%); z-index: 2; width: 3rem; height: 3rem; padding: 0; font-size: 1.75rem; line-height: 1; opacity: .8; }
.pixiv-viewer-arrow.left { left: .5rem; }
.pixiv-viewer-arrow.right { right: .5rem; }
.pixiv-viewer-arrow:disabled { opacity: .3; }
/* .modal-dialog 是 pointer-events: none，箭頭在視窗外時點擊會穿透到背景而關閉視窗；停用的箭頭也要接住點擊 */
.pixiv-viewer-arrow, .pixiv-viewer-arrow:disabled { pointer-events: auto; }
@media (min-width: 1300px) {
    .pixiv-viewer-dialog > .pixiv-viewer-arrow.left { left: -4rem; }
    .pixiv-viewer-dialog > .pixiv-viewer-arrow.right { right: -4rem; }
}
