.bmarket-view-container, .bmarket-wrapper, .bmarket-image-zone, .bmarket-thumb-container, .bmarket-info-zone, .bmarket-control-panel, .bmarket-spec-table { box-sizing: border-box !important; }
.bmarket-view-container { width: 100% !important; }
.bmarket-main-frame {position: relative ;overflow: hidden ;display: flex ;align-items: center ;justify-content: center ;background-color: #f8f9fa;}
.bmarket-main-frame img#main_image {width: auto !important;        height: auto !important;        max-width: 100% !important;        max-height: 100% !important;        object-fit: contain !important; display: block !important;}

.bmarket-state-soldout { opacity: 0.8 !important; }
.bmarket-state-soldout .bmarket-main-photo { filter: blur(6px) grayscale(100%) !important; opacity: 0.6 !important; }
.bmarket-state-soldout::after { content: '판매완료' !important; position: absolute !important; top: 50% !important; left: 50% !important; transform: translate(-50%, -50%) !important; background-color: #18181b !important; color: #ffffff !important; font-size: 13px !important; font-weight: 700 !important; padding: 10px 20px !important; border-radius: 30px !important; letter-spacing: -0.3px !important; z-index: 10 !important; box-shadow: 0 4px 12px rgba(0,0,0,0.2) !important; }
.bmarket-thumb-container { width: 100% !important; max-width: 100% !important; overflow-x: hidden !important; overflow-y: hidden !important; padding-bottom: 6px !important; }
.bmarket-thumb-container:has(.bmarket-thumb-hidden[style*="inline-flex"]), .bmarket-thumb-container:has(.bmarket-thumb-hidden[style*="block"]) { overflow-x: auto !important; }
.bmarket-thumb-container::-webkit-scrollbar { height: 8px !important; display: block !important; } .bmarket-thumb-container::-webkit-scrollbar-track { background: #f4f4f5 !important; border-radius: 10px !important; } .bmarket-thumb-container::-webkit-scrollbar-thumb { background: #cbd5e1 !important; border-radius: 10px !important; border: 2px solid #f4f4f5 !important; } .bmarket-thumb-container::-webkit-scrollbar-thumb:hover { background: #94a3b8 !important; }
.bmarket-thumb-list { display: flex !important; flex-direction: row !important; flex-wrap: nowrap !important; align-items: center !important; justify-content: flex-start !important; gap: 8px !important; padding: 6px 0 !important; margin: 0 !important; list-style: none !important; width: max-content !important; }
.bmarket-thumb-item { display: inline-flex !important; align-items: center !important; justify-content: center !important; border: 1px solid #f4f4f5 !important; border-radius: 8px !important; background-color: #ffffff !important; overflow: hidden !important; cursor: pointer !important; flex-shrink: 0 !important; transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important; box-shadow: 0 2px 8px rgba(0,0,0,0.02) !important; }

/* 💡 본문 아래 썸네일 박스 영역 안에서만 원래 주셨던 100% cover 스타일이 작동하도록 차단선 고정 */
.bmarket-thumb-list .bmarket-thumb-item img { width: 100% !important; height: 100% !important; object-fit: cover !important; display: block !important; }

/* 💡 썸네일 스타일이 팝업 내부로 흘러들어오는 현상은 차단하되, 확대 자바스크립트를 절대로 방해하지 않는 비율 방어선 */
.pswp .pswp__img {
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important; /* ➔ 늘어지거나 세로로 찌그러지는 현상만 물리적으로 원천 차단 */
}

/* 💡 돋보기 확대를 눌렀을 때(.pswp--zoomed-in)는 CSS 방어막을 완전히 해제하여 자바스크립트가 원본 크기까지 시원하게 키우도록 허용 */
.pswp.pswp--zoomed-in .pswp__img {
    max-width: none !important;
    max-height: none !important;
}
/* 💡 [번호 밀림 완벽 종결] 이 상품 게시판(uid="1")에서 열린 포토스와이프 팝업창의 내부 락 해제 */
.pswp.pswp--uid-1 .pswp__container {
    display: flex !important;
}

/* 💡 포토스와이프 자바스크립트의 필수 좌표값 계산을 방해하던 left: auto 오작동 제거 */
.pswp.pswp--uid-1 .pswp__item {
    position: relative !important;
}


.bmarket-thumb-item:hover { border-color: #d4d4d8 !important; transform: translateY(-2px) !important; box-shadow: 0 4px 12px rgba(0,0,0,0.06) !important; }
.bmarket-thumb-item.bmarket-btn-action { font-family: 'Outfit', "Noto Sans KR", sans-serif !important; font-size: 10px !important; font-weight: 600 !important; color: #71717a !important; background-color: #f4f4f5 !important; text-align: center !important; user-select: none !important; border: none !important; flex-direction: column !important; line-height: 1.3 !important; padding: 2px !important; gap: 1px !important; }
.bmarket-thumb-item.bmarket-btn-action:hover { background-color: #e4e4e7 !important; color: #18181b !important; }

/* 💡 교정: 버튼 격리 구조 변경에 맞춰 숨김 처리 대상 매칭 경로 정정 */
.bmarket-thumb-list .bmarket-thumb-hidden, #market_close_btn { display: none !important; }

.bmarket-spec-table { border-collapse: collapse !important; border-spacing: 0 !important; width: 100% !important; background-color: #ffffff !important; border: none !important; }
.bmarket-spec-table tr { border-bottom: 1px solid #f4f4f5 !important; } .bmarket-spec-table tr:last-child { border-bottom: none !important; }
.bmarket-spec-table th { width: 70px !important; padding: 10px 0 !important; font-size: 13px !important; font-weight: 500 !important; color: #a1a1aa !important; text-align: left !important; background: none !important; border: none !important; }
.bmarket-spec-table td { padding: 10px 12px !important; font-size: 13.5px !important; color: #18181b !important; vertical-align: middle; font-weight: 500 !important; border: none !important; }
.bmarket-price-text { font-size: 18px !important; font-weight: 700 !important; color: #f43f5e !important; letter-spacing: -0.3px !important; }
.bmarket-author-box { display: inline-flex !important; align-items: center !important; gap: 6px !important; font-weight: 600 !important; color: #09090b !important; }
.bmarket-btn-msg { display: inline-flex !important; align-items: center !important; font-size: 11px !important; font-weight: 600 !important; color: #2563eb !important; background-color: #eff6ff !important; border: none !important; padding: 3px 8px !important; border-radius: 4px !important; text-decoration: none !important; transition: all 0.15s !important; } .bmarket-btn-msg:hover { background-color: #dbeafe !important; }

.bmarket-link-toggle { font-size: 12px !important; color: #2563eb !important; text-decoration: none !important; font-weight: 600; background-color: #f0f4ff !important; padding: 4px 8px !important; border-radius: 4px !important; transition: all 0.15s !important; display: inline-block !important; } .bmarket-link-toggle:hover { background-color: #dbeafe !important; }
.bmarket-empty-text, .bmarket-guest-text { font-size: 12px !important; color: #a1a1aa !important; font-style: normal !important; display: inline-block !important; }
.bmarket-category-text { font-weight: 600 !important; color: #09090b !important; }
.bmarket-btn { display: inline-flex !important; align-items: center !important; justify-content: center !important; padding: 12px 16px !important; font-size: 13px !important; font-weight: 600 !important; border-radius: 10px !important; text-decoration: none !important; transition: all 0.2s cubic-bezier(0.4, 0, 0.2, 1) !important; border: none !important; box-shadow: 0 2px 8px rgba(0,0,0,0.04) !important; } .bmarket-btn:hover { transform: translateY(-1px) !important; box-shadow: 0 4px 12px rgba(0,0,0,0.08) !important; }
.bmarket-btn-status { color: #ffffff !important; }
.bmarket-status-complete { background-color: #18181b !important; } .bmarket-status-complete:hover { background-color: #27272a !important; }
.bmarket-status-resell { background-color: #f59e0b !important; } .bmarket-status-resell:hover { background-color: #d97706 !important; }
.bmarket-btn-scrap { display: inline-flex !important; font-size: 12px !important; font-weight: 500 !important; color: #4b5563 !important; background-color: #f3f4f6 !important; border: 1px solid #e5e7eb !important; padding: 8px 12px !important; border-radius: 6px !important; text-decoration: none !important; } .bmarket-btn-scrap:hover { background-color: #e5e7eb !important; }
.bmarket-btn-raise { background-color: #0ea5e9 !important; color: #ffffff !important; } .bmarket-btn-raise:hover { background-color: #0284c7 !important; }
.bmarket-control-panel .bmarket-btn { width: 100% !important; display: inline-flex !important; justify-content: center !important; text-align: center !important; box-sizing: border-box !important; }
.bmarket-spec-table .bmarket-sns-cell { padding: 8px 0 12px 0 !important; }
.bmarket-status-complete { content: "" !important; }

.bmarket-status-complete { background-color: #e11d48 !important; }
.bmarket-status-complete:hover { background-color: #c50c35 !important; }
.bmarket-status-resell { background-color: #f59e0b !important; }
.bmarket-status-resell:hover { background-color: #d97706 !important; }
/*안전거래*/
.bmarket-warning-box { width: 100% !important; border: 1px solid #e4e4e7 !important; border-radius: 8px !important; background-color: #fafafa !important; padding: 16px !important; margin-bottom: 16px !important; box-sizing: border-box !important; }
.bmarket-warning-text { font-size: 13px !important; color: #3f3f46 !important; line-height: 1.6 !important; font-family: sans-serif !important; }
.bmarket-warning-video { margin-top: 10px !important; }
.bmarket-warning-video a { font-size: 13px !important; color: #003ff9 !important; font-weight: 500 !important; text-decoration: none !important; }
.bmarket-scam-panel { display: block !important; clear: both !important; text-align: center !important; margin: 16px auto !important; width: 100% !important; max-width: 480px !important; box-sizing: border-box !important; padding: 0 10px !important; }
.bmarket-scam-row { display: flex !important; flex-wrap: wrap !important; justify-content: center !important; gap: 10px !important; width: 100% !important; }
.bmarket-scam-btn { flex: 1 !important; min-width: 140px !important; display: inline-block !important; color: #ffffff !important; font-size: 12.5px !important; font-weight: bold !important; padding: 12px 10px !important; border-radius: 8px !important; text-decoration: none !important; box-shadow: 0 4px 6px rgba(0,0,0,0.06) !important; font-family: sans-serif !important; white-space: nowrap !important; box-sizing: border-box !important; text-align: center !important; }
.bmarket-scam-btn.bmarket-btn-police { background-color: #555 !important; }
.bmarket-scam-btn.bmarket-btn-thecheat { background-color: #555 !important; }
.bmarket-scam-footer { margin: 8px 0 0 0 !important; font-size: 11px !important; color: #94a3b8 !important; text-align: center !important; font-family: sans-serif !important; }
/*안전거래*/
/* ==========================================================================
   [모바일 반응형 레이아웃 차별화 분기점] - 원본 HTML 수정 없이 강제 제어
   ========================================================================== */
@media screen and (max-width: 768px) {
    
    /* 1. 모바일에서는 좌우 정렬을 깨고 상하(세로) 배치로 강제 변경 */
    .bmarket-wrapper { display: flex !important; flex-direction: column !important; gap: 20px !important; }
    
    /* 2. 이미지 영역 가로폭을 모바일 화면에 맞춰 100%로 확장 */
    .bmarket-image-zone { width: 100% !important; }
    
    /* 3. 메인 큰 이미지 프레임 가로폭 확장 및 세로 비율 자동화 */
    .bmarket-main-frame { width: 100% !important; height: auto !important; aspect-ratio: 4 / 3 !important; }
    
    /* 4. 하단 개별 썸네일들의 크기를 모바일에 맞게 강제 고정 (💡 가로 터짐 방지를 위해 부모 리스트와 버튼 규격 일괄 연동) */
    .bmarket-thumb-list { width: 100% !important; flex-wrap: wrap !important; gap: 6px !important; }
    .bmarket-thumb-item { width: 48px !important; height: 48px !important; }
    .bmarket-thumb-item.bmarket-btn-action { width: 48px !important; height: 48px !important; font-size: 9px !important; }

    /* 5. 정보 구역을 모바일 폭 100%로 채우고, 요소 간 간격을 12px로 좁힘 */
    .bmarket-info-zone { width: 100% !important; max-width: 100% !important; gap: 12px !important; display: flex !important; flex-direction: column !important; }
    
    /* 6. 스펙 테이블 내부 셀(th, td) 여백 및 글자 크기를 모바일에 맞게 조절 */
    .bmarket-spec-table th { width: 65px !important; padding: 10px 0 !important; font-size: 12px !important; }
    .bmarket-spec-table td { padding: 10px 8px !important; font-size: 12.5px !important; }
    
    /* 7. 가격 텍스트 크기를 모바일 화면 크기에 적당하게 최적화 */
    .bmarket-price-text { font-size: 16px !important; }
    
    /* 8. 하단 버튼 영역(컨트롤 패널) 여백 조절 */
    .bmarket-control-panel { margin-top: 8px !important; width: 100% !important; }
}
