/* =====================================================
   photo.css — 사진 호버 패널·모달·탭 스타일
   ===================================================== */

/* 사진 호버 미리보기 */
#photo-hover-panel {
    position: fixed; z-index: 9999; pointer-events: none;
    background: rgba(10,20,35,0.95); border: 1px solid #0a84ff66;
    border-radius: 8px; padding: 8px; max-width: 220px;
    box-shadow: 0 4px 20px rgba(0,0,0,0.6);
    display: none; flex-direction: column; gap: 6px;
}
#photo-hover-panel img { width: 200px; height: 130px; object-fit: cover; border-radius: 5px; display: block; }
#photo-hover-panel .php-cat { font-size: 12px; color: #4fc3f7; font-weight: bold; }
#photo-hover-panel .php-area { font-size: 10px; color: #888; }

/* 사진 클릭 모달 */
#photo-modal {
    display: none; position: fixed; inset: 0; z-index: 10000;
    background: rgba(0,0,0,0.85); align-items: center; justify-content: center;
    flex-direction: column; gap: 12px;
}
#photo-modal.open { display: flex; }
#photo-modal img { max-width: 90vw; max-height: 80vh; border-radius: 8px; box-shadow: 0 0 40px rgba(0,0,0,0.8); }
#photo-modal .pm-close { position: absolute; top: 16px; right: 20px; font-size: 28px; color: #fff; cursor: pointer; background: none; border: none; }
#photo-modal .pm-info { color: #e0e0e0; font-size: 14px; text-align: center; }
#photo-modal .pm-nav { display: flex; gap: 12px; }
#photo-modal .pm-nav button { background: rgba(10,132,255,0.3); border: 1px solid #0a84ff66; color: #fff; padding: 6px 16px; border-radius: 6px; cursor: pointer; font-size: 13px; }
#photo-modal .pm-nav button:hover { background: rgba(10,132,255,0.6); }

/* 사진 탭 패널 */
#photo-panel h3 { margin: 0 0 10px; color: #4fc3f7; font-size: 14px; }
#photo-toggle-row { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; font-size: 12px; color: #ccc; }
#photo-toggle-row input[type=checkbox] { accent-color: #0a84ff; width: 15px; height: 15px; }
#photo-stats { font-size: 11px; color: #888; margin-bottom: 8px; }
#photo-category-filter { display: flex; flex-wrap: wrap; gap: 5px; }
.photo-cat-btn {
    font-size: 11px; padding: 3px 8px; border-radius: 10px; cursor: pointer;
    border: 1px solid #0a84ff44; background: rgba(10,132,255,0.1); color: #aaa;
    transition: all .15s;
}
.photo-cat-btn.active { background: rgba(10,132,255,0.4); color: #fff; border-color: #0a84ff; }