/* style.css */
body { font-family: 'Noto Sans KR', sans-serif; margin: 0; padding: 0; background-color: #f8f9fa; color: #333; }
.container { max-width: 600px; margin: 0 auto; padding: 20px; background: white; min-height: 100vh; box-shadow: 0 0 20px rgba(0,0,0,0.05); }

/* 헤더 */
.header { display: flex; justify-content: space-between; align-items: center; padding: 10px 0 20px 0; }
.logo { font-size: 1.5rem; font-weight: bold; color: #222; text-decoration: none; }
.register-btn { background-color: #222; color: white; padding: 10px 15px; border-radius: 8px; text-decoration: none; font-weight: bold; font-size: 0.9rem; }

/* 검색창 */
.search-box { margin-bottom: 15px; }
#search-input { width: 100%; padding: 12px; border: 1px solid #ddd; border-radius: 10px; font-size: 1rem; box-sizing: border-box; background: #f8f9fa; }

/* 카테고리 필터 */
.category-filters { display: flex; gap: 8px; overflow-x: auto; margin-bottom: 30px; padding-bottom: 5px; -webkit-overflow-scrolling: touch; }
.category-filters::-webkit-scrollbar { display: none; } /* 스크롤바 숨김 */
.filter-btn { padding: 8px 16px; border: 1px solid #eee; border-radius: 20px; background: white; color: #666; cursor: pointer; white-space: nowrap; font-size: 0.9rem; transition: 0.2s; }
.filter-btn:hover { background: #f1f3f5; }
.filter-btn.active { background: #222; color: white; border-color: #222; font-weight: bold; }

/* 리스트 및 카드 */
.section-title { font-size: 1.1rem; font-weight: bold; margin-bottom: 15px; }
#gym-list { display: grid; gap: 25px; }

.gym-card { background: white; border-radius: 15px; overflow: hidden; box-shadow: 0 4px 15px rgba(0,0,0,0.08); cursor: pointer; transition: transform 0.2s; border: 1px solid #eee; }
.gym-card:active { transform: scale(0.98); }
.gym-card img { width: 100%; height: 180px; object-fit: cover; }
.gym-info { padding: 18px; }

.category-tag { display: inline-block; background: #f1f3f5; color: #495057; font-size: 0.75rem; padding: 4px 8px; border-radius: 4px; margin-bottom: 8px; font-weight: bold; }
.gym-name { margin: 0 0 5px 0; font-size: 1.15rem; font-weight: bold; }
.gym-loc { margin: 0; font-size: 0.85rem; color: #868e96; }

.price-section { margin-top: 15px; display: flex; justify-content: space-between; align-items: flex-end; border-top: 1px dashed #eee; padding-top: 15px; }
.current-price { font-size: 1.25rem; font-weight: bold; color: #ef6253; }
.drop-info { font-size: 0.8rem; color: #41b979; font-weight: bold; background: #e6fcf5; padding: 4px 8px; border-radius: 6px; }

/* 내 글 / 입찰 뱃지 스타일 */
.my-badge {
    position: absolute;
    top: 10px;
    right: 10px; /* 오른쪽 상단에 배치 */
    padding: 5px 8px;
    border-radius: 6px;
    font-size: 0.75rem;
    font-weight: bold;
    color: white;
    z-index: 2; /* 이미지 위로 올라오게 */
    box-shadow: 0 2px 4px rgba(0,0,0,0.2);
}

.my-badge.owner {
    background-color: #7048e8; /* 보라색 (주인) */
}

.my-badge.bidder {
    background-color: #e03131; /* 빨간색 (입찰자) */
}