/* カラナビ Frontend Styles */
.karanavi-table-wrap { overflow-x: auto; margin: 20px 0; }
.karanavi-table { width: 100%; border-collapse: collapse; font-size: 14px; }
.karanavi-table th { background: #f8f9fa; padding: 10px 12px; text-align: left; font-weight: 600; border-bottom: 2px solid #dee2e6; white-space: nowrap; }
.karanavi-table td { padding: 10px 12px; border-bottom: 1px solid #eee; vertical-align: top; }
.karanavi-table tr:hover { background: #f8f9fa; }

.karanavi-badge { display: inline-block; padding: 3px 10px; border-radius: 20px; background: #ffe0e8; color: #d63384; font-size: 11px; font-weight: 600; margin: 2px; white-space: nowrap; }

/* Store Card */
.karanavi-store-card { background: #fff; border: 1px solid #e8e8e8; border-radius: 12px; padding: 24px; margin: 20px 0; }
.karanavi-store-info p { margin: 6px 0; font-size: 14px; color: #444; }
.karanavi-store-info strong { color: #222; }

.karanavi-feature-highlight { background: #fff3cd; border-left: 4px solid #ffc107; padding: 16px; margin: 16px 0; border-radius: 0 8px 8px 0; }
.karanavi-feature-highlight h4 { margin: 0 0 8px; font-size: 15px; color: #856404; }
.karanavi-feature-highlight p { margin: 4px 0; font-size: 14px; }

.karanavi-features { margin: 12px 0; }
.karanavi-links { margin: 12px 0; }
.karanavi-links a { display: inline-block; padding: 8px 16px; background: #2271b1; color: #fff; text-decoration: none; border-radius: 6px; margin-right: 8px; font-size: 13px; font-weight: 600; }
.karanavi-links a:hover { background: #135e96; }

/* Mini Card */
.karanavi-search-results { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); gap: 16px; margin: 16px 0; }
.karanavi-mini-card { background: #fff; border: 1px solid #e8e8e8; border-radius: 10px; padding: 16px; transition: box-shadow 0.2s; }
.karanavi-mini-card:hover { box-shadow: 0 4px 12px rgba(0,0,0,0.08); }
.karanavi-mini-card-header { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.karanavi-mini-card-header strong { font-size: 15px; }
.karanavi-mini-price { color: #e85d30; font-weight: 700; font-size: 14px; }
.karanavi-mini-card-body { font-size: 13px; color: #666; }
.karanavi-mini-card-body span { display: block; margin: 3px 0; }
.karanavi-mini-card-tags { margin-top: 8px; }

/* Reviews */
.karanavi-reviews { margin: 16px 0; }
.karanavi-ai-summary { background: #f0f4ff; border: 1px solid #d0d8f0; border-radius: 10px; padding: 16px; margin-bottom: 16px; }
.karanavi-ai-summary h4 { margin: 0 0 10px; font-size: 15px; color: #1a3a6a; }
.karanavi-scores { margin-top: 12px; }
.karanavi-score-row { display: flex; align-items: center; gap: 10px; margin: 6px 0; }
.karanavi-score-label { font-size: 12px; font-weight: 600; color: #555; width: 70px; text-align: right; }
.karanavi-score-bar { flex: 1; height: 8px; background: #e0e0e0; border-radius: 4px; overflow: hidden; }
.karanavi-score-fill { height: 100%; border-radius: 4px; background: linear-gradient(90deg, #2271b1, #46b1e8); transition: width 0.6s ease; }
.karanavi-score-num { font-size: 12px; font-weight: 700; color: #555; width: 36px; }

.karanavi-review-posts { display: flex; flex-direction: column; gap: 8px; }
.karanavi-review-post { background: #fafafa; border: 1px solid #eee; border-radius: 8px; padding: 12px; display: flex; gap: 10px; align-items: flex-start; }
.karanavi-review-sentiment { font-size: 18px; flex-shrink: 0; }
.karanavi-review-post p { margin: 0; font-size: 14px; color: #333; flex: 1; }
.karanavi-review-date { font-size: 11px; color: #999; flex-shrink: 0; }

/* Map */
.karanavi-map-wrap { margin: 16px 0; border-radius: 12px; overflow: hidden; }
.karanavi-map-actions { margin-top: 8px; text-align: right; }
.karanavi-map-actions a { font-size: 13px; color: #2271b1; text-decoration: none; font-weight: 600; }
.karanavi-map-actions a:hover { text-decoration: underline; }
.karanavi-map-link { margin: 16px 0; }
.karanavi-map-link a { display: inline-block; padding: 12px 20px; background: #f0f0f0; border-radius: 8px; text-decoration: none; color: #333; font-weight: 600; }
.karanavi-marker { background: none !important; border: none !important; }

/* Nearby */
.karanavi-nearby { margin: 20px 0; }
.karanavi-nearby-btn { display: inline-flex; align-items: center; gap: 8px; padding: 14px 24px; background: linear-gradient(135deg, #e85d30, #ff8a5c); color: #fff; border: none; border-radius: 10px; font-size: 15px; font-weight: 700; cursor: pointer; transition: transform 0.2s; }
.karanavi-nearby-btn:hover { transform: scale(1.02); }
.karanavi-nearby-results { margin-top: 16px; }

/* FAQ */
.karanavi-faq { margin: 16px 0; }
.karanavi-faq details { border: 1px solid #e8e8e8; border-radius: 8px; margin-bottom: 8px; overflow: hidden; }
.karanavi-faq summary { padding: 14px 16px; font-weight: 600; cursor: pointer; background: #fafafa; font-size: 14px; }
.karanavi-faq details[open] summary { border-bottom: 1px solid #e8e8e8; }
.karanavi-faq details p { padding: 14px 16px; margin: 0; font-size: 14px; color: #555; }

/* Tips */
.karanavi-tips { background: #f0f9f0; border: 1px solid #c3e6cb; border-radius: 10px; padding: 16px 20px; }
.karanavi-tips ul { margin: 8px 0; padding-left: 20px; }
.karanavi-tips li { margin: 6px 0; font-size: 14px; }

/* No results */
.karanavi-no-results, .karanavi-no-reviews { text-align: center; padding: 20px; color: #999; font-size: 14px; }

/* Responsive */
@media (max-width: 768px) {
    .karanavi-search-results { grid-template-columns: 1fr; }
    .karanavi-score-label { width: 50px; }
}