:root {
    --primary-color: #2e7d32;
    --secondary-color: #f5f5f5;
    --accent-color: #ffa000;
    --text-color: #333;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: 'Segoe UI', sans-serif; background-color: #f0f2f5; color: var(--text-color); }

header { background: #fff; box-shadow: 0 2px 4px rgba(0,0,0,0.1); padding: 1rem 0; position: sticky; top: 0; z-index: 1000; }
.header-container { max-width: 1200px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; padding: 0 1.5rem; }
.logo { color: var(--primary-color); font-weight: bold; font-size: 1.5rem; }
.search-box { display: flex; gap: 0.5rem; flex-grow: 1; max-width: 600px; }
.search-box input { width: 100%; padding: 0.6rem 1rem; border: 2px solid #ddd; border-radius: 4px; }
.search-box button { padding: 0.6rem 1.2rem; background-color: var(--primary-color); color: #fff; border: none; border-radius: 4px; cursor: pointer; }

.container { display: flex; max-width: 1200px; margin: 2rem auto; padding: 0 1.5rem; gap: 2rem; }
.sidebar { width: 250px; flex-shrink: 0; background: #fff; border-radius: 8px; padding: 1.5rem; box-shadow: 0 1px 3px rgba(0,0,0,0.1); height: fit-content; }
.category-list li { padding: 0.8rem; border-radius: 4px; cursor: pointer; list-style: none; }
.category-list li.active { background: var(--primary-color); color: white; font-weight: bold; }

.content { flex-grow: 1; }
.product-card { background: #fff; border-radius: 12px; padding: 2rem; margin-bottom: 2rem; box-shadow: 0 4px 12px rgba(0,0,0,0.08); }

.product-title-area { margin-bottom: 1.5rem; border-bottom: 2px solid #f0f0f0; padding-bottom: 1rem; }
.product-name { font-size: 1.5rem; color: #1b5e20; margin-bottom: 0.3rem; }
.brand-tag { background: #e8f5e9; color: #2e7d32; padding: 2px 10px; border-radius: 20px; font-size: 0.85rem; font-weight: bold; }

.info-grid { display: grid; grid-template-columns: 1fr 1.5fr; gap: 2rem; }

/* 영양성분 박스 */
.nutrition-box h4, .links-box h4 { font-size: 1rem; margin-bottom: 1rem; color: #666; }
.nutrition-table { width: 100%; border-collapse: collapse; background: #fafafa; border-radius: 8px; overflow: hidden; }
.nutrition-table td { padding: 10px 15px; border-bottom: 1px solid #eee; font-size: 0.9rem; }
.nutrition-table td:last-child { text-align: right; font-weight: bold; color: #333; }

/* 링크 리스트 (이미지 포함) */
.links-list { display: flex; flex-direction: column; gap: 1rem; }
.link-item { display: flex; align-items: center; gap: 1rem; background: #fff; border: 1px solid #eee; padding: 12px; border-radius: 8px; transition: transform 0.2s; }
.link-item:hover { transform: translateX(5px); border-color: var(--primary-color); }

.link-img-wrapper { width: 60px; height: 60px; flex-shrink: 0; border: 1px solid #f0f0f0; border-radius: 4px; overflow: hidden; background: #fff; }
.link-thumb { width: 100%; height: 100%; object-fit: contain; }

.link-info { flex-grow: 1; display: flex; justify-content: space-between; align-items: center; }
.site-name { font-weight: bold; font-size: 0.95rem; color: #444; }

.buy-link-btn { padding: 8px 16px; border-radius: 4px; text-decoration: none; font-weight: bold; font-size: 0.85rem; color: white; transition: opacity 0.2s; }
.buy-link-btn.coupang { background: #0076ff; }
.buy-link-btn.iherb { background: #4caf50; }
.buy-link-btn.google { background: #4285f4; }
.buy-link-btn:hover { opacity: 0.8; }

@media (max-width: 992px) {
    .info-grid { grid-template-columns: 1fr; }
    .container { flex-direction: column; }
    .sidebar { width: 100%; }
}
