/* ==========================================================================
   Daily Brief Styles - RWL-DAILY-BRIEF-01
   ========================================================================== */

.daily-brief-page {
  --accent-color: #1a73e8;
  --text-color: #333;
  --muted-color: #666;
  --subtle-bg: #f5f5f5;
  --card-bg: #fff;
  --border-color: #e0e0e0;

  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Noto Sans JP', sans-serif;
  line-height: 1.6;
  color: var(--text-color);
  background: var(--subtle-bg);
  min-height: 100vh;
}

/* Header */
.daily-header {
  background: var(--card-bg);
  padding: 1.5rem;
  text-align: center;
}

.daily-header h1 {
  margin: 0.5rem 0 0.25rem;
  font-size: 1.75rem;
  font-weight: 700;
}

.header-subtitle {
  color: var(--muted-color);
  font-size: 0.9375rem;
  margin: 0;
}

.breadcrumb {
  font-size: 0.8125rem;
  color: var(--muted-color);
}

.breadcrumb a {
  color: var(--accent-color);
  text-decoration: none;
}

/* Main */
.daily-main {
  max-width: 900px;
  margin: 0 auto;
  padding: 1.5rem;
}

/* Sections */
.daily-section {
  background: var(--card-bg);
  border-radius: 12px;
  padding: 1.5rem;
  margin-bottom: 1.5rem;
}

.daily-section h2 {
  font-size: 1.125rem;
  font-weight: 600;
  margin: 0 0 1rem 0;
  padding-bottom: 0.5rem;
}

/* Snapshot */
.snapshot-date {
  font-size: 0.875rem;
  color: var(--muted-color);
  margin-bottom: 1rem;
}

.snapshot-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1rem;
}

.snapshot-card {
  background: var(--subtle-bg);
  border-radius: 8px;
  padding: 1rem;
}

.snapshot-card h3 {
  font-size: 0.875rem;
  font-weight: 600;
  margin: 0 0 0.75rem 0;
  color: var(--muted-color);
}

.snapshot-numbers {
  display: flex;
  gap: 1.5rem;
}

.number-item {
  text-align: center;
}

.number-value {
  display: block;
  font-size: 2rem;
  font-weight: 700;
  color: var(--text-color);
}

.number-item.watched .number-value {
  color: var(--accent-color);
}

.number-label {
  font-size: 0.6875rem;
  text-transform: uppercase;
  color: var(--muted-color);
  letter-spacing: 0.5px;
}

.data-days {
  font-size: 0.75rem;
  color: var(--muted-color);
  margin-top: 0.5rem;
}

.no-changes, .no-data, .no-watched {
  color: var(--muted-color);
  font-size: 0.9375rem;
}

.hint {
  font-size: 0.8125rem;
  color: #999;
  margin-top: 0.5rem;
}

/* Tables */
.breakdown-table,
.most-changed-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875rem;
}

.breakdown-table th,
.breakdown-table td,
.most-changed-table th,
.most-changed-table td {
  padding: 0.5rem 0.75rem;
  text-align: left;
}

.breakdown-table th,
.most-changed-table th {
  font-weight: 600;
  color: var(--muted-color);
  font-size: 0.75rem;
  text-transform: uppercase;
}

.most-changed-table a {
  color: var(--text-color);
  text-decoration: none;
}

.most-changed-table a:hover {
  color: var(--accent-color);
}

.row-watched {
  background: rgba(26, 115, 232, 0.05);
}

.change-count {
  font-weight: 600;
  color: var(--accent-color);
}

.change-types {
  font-size: 0.9375rem;
}

.badge-watched {
  font-size: 0.75rem;
  opacity: 0.7;
}

/* 本日の監視対象 */
.watched-list {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.watched-item {
  padding: 0.75rem;
  background: rgba(26, 115, 232, 0.05);
  border-radius: 8px;
}

.watched-main {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  flex-wrap: wrap;
}

.watched-brand {
  font-size: 0.6875rem;
  text-transform: uppercase;
  color: var(--muted-color);
}

.watched-name {
  font-weight: 500;
  color: var(--text-color);
  text-decoration: none;
}

.watched-name:hover {
  color: var(--accent-color);
}

.watched-icons {
  margin-left: auto;
}

.watched-detail {
  margin-top: 0.5rem;
  font-size: 0.8125rem;
}

.price-change {
  padding: 0.125rem 0.5rem;
  border-radius: 4px;
  font-weight: 500;
}

.price-change.up {
  background: rgba(220, 53, 69, 0.1);
  color: #dc3545;
}

.price-change.down {
  background: rgba(40, 167, 69, 0.1);
  color: #28a745;
}

/* Official Updates */
.official-updates-section .feed-meta {
  font-size: 0.75rem;
  color: var(--muted-color);
  margin-bottom: 1rem;
}

.issue-list {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.issue-item {
  padding: 0.75rem;
  background: var(--subtle-bg);
  border-radius: 8px;
}

.issue-item.issue-watched {
  background: rgba(26, 115, 232, 0.05);
}

.issue-meta {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.375rem;
  font-size: 0.75rem;
}

.issue-date {
  color: var(--muted-color);
}

.issue-brand {
  font-weight: 500;
  color: var(--text-color);
}

.issue-source {
  padding: 0.125rem 0.375rem;
  background: #e3e3e3;
  border-radius: 3px;
  font-size: 0.625rem;
  text-transform: uppercase;
  color: #666;
}

.issue-title {
  display: block;
  font-size: 0.9375rem;
  color: var(--text-color);
  text-decoration: none;
  line-height: 1.4;
}

.issue-title:hover {
  color: var(--accent-color);
}

.issue-tags {
  margin-top: 0.375rem;
  display: flex;
  gap: 0.25rem;
}

.issue-tag {
  padding: 0.125rem 0.375rem;
  background: #f0f0f0;
  border-radius: 3px;
  font-size: 0.625rem;
  text-transform: uppercase;
  color: #666;
}

.issue-tag.tag-recovery_wear { background: #e3f2fd; color: #1565c0; }
.issue-tag.tag-sleep { background: #e8f5e9; color: #2e7d32; }
.issue-tag.tag-price { background: #fff3e0; color: #ef6c00; }
.issue-tag.tag-cert { background: #fce4ec; color: #c2185b; }
.issue-tag.tag-new_product { background: #f3e5f5; color: #7b1fa2; }
.issue-tag.tag-collab { background: #e0f7fa; color: #00838f; }

.view-all-link {
  display: inline-block;
  margin-top: 0.75rem;
  font-size: 0.8125rem;
  color: var(--accent-color);
  text-decoration: none;
}

.view-all-link:hover {
  text-decoration: underline;
}

/* Issue Diff Styles */
.issue-diff-summary {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 1rem;
  padding: 0.75rem 1rem;
  background: #e8f5e9;
  border-radius: 8px;
  font-size: 0.875rem;
}

.diff-new {
  font-weight: 600;
  color: #2e7d32;
}

.diff-watched {
  color: var(--accent-color);
  font-weight: 500;
}

.diff-period {
  margin-left: auto;
  color: var(--muted-color);
  font-size: 0.75rem;
}

.issue-new-badge {
  padding: 0.125rem 0.375rem;
  background: #4caf50;
  color: #fff;
  border-radius: 3px;
  font-size: 0.5625rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.issue-item.issue-new {
  background: rgba(76, 175, 80, 0.08);
}

.issue-item.issue-new.issue-watched {
  background: linear-gradient(90deg, rgba(26, 115, 232, 0.08), rgba(76, 175, 80, 0.05));
}

.issue-feed-footer {
  margin-top: 1rem;
  padding-top: 0.75rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem;
}

.issue-feed-footer .feed-meta {
  font-size: 0.75rem;
  color: var(--muted-color);
}

.issue-feed-footer .view-all-link {
  margin-top: 0;
}

/* Quick Jump */
.quick-links {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.quick-link {
  display: inline-block;
  padding: 0.5rem 1rem;
  background: var(--subtle-bg);
  border-radius: 20px;
  color: var(--text-color);
  text-decoration: none;
  font-size: 0.875rem;
  transition: all 0.2s;
}

.quick-link:hover {
  background: var(--accent-color);
  color: #fff;
}

/* Footer */
.daily-footer {
  text-align: center;
  padding: 1.5rem;
  font-size: 0.8125rem;
  color: var(--muted-color);
}

.daily-footer a {
  color: var(--accent-color);
  text-decoration: none;
}

/* Responsive */
@media (max-width: 600px) {
  .daily-main {
    padding: 1rem;
  }

  .snapshot-numbers {
    flex-direction: column;
    gap: 0.75rem;
  }

  .number-value {
    font-size: 1.5rem;
  }

  .breakdown-table,
  .most-changed-table {
    font-size: 0.8125rem;
  }

  .breakdown-table th,
  .breakdown-table td,
  .most-changed-table th,
  .most-changed-table td {
    padding: 0.375rem 0.5rem;
  }
}