/* ============================================================
   daily.css — 日报页专用样式
   Date Chips + Masthead + 版块 + 卡片 + 分页 + 往期 + 订阅 + Mobile Tabbar
   ============================================================ */

/* Daily Page Container */
.daily-page {
  max-width: 100%;
  margin: 0 auto;
  padding: 0 var(--space-4);
}

/* Date Chips Bar */
.daily-chips-bar {
  position: sticky;
  top: var(--header-h, 60px);
  z-index: 90;
  background: var(--color-bg-container);
  border-bottom: 1px solid var(--color-border-tertiary);
  margin: 0 calc(-1 * var(--space-4));
  padding: var(--space-3) var(--space-4);
}
.daily-chips {
  display: flex;
  gap: var(--feed-gap, 8px);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.daily-chips::-webkit-scrollbar { display: none; }
.daily-chip {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  padding: var(--space-2) var(--space-4);
  border: 1px solid var(--color-border-secondary);
  border-radius: var(--radius-xl);
  background: var(--color-bg-container);
  cursor: pointer;
  flex-shrink: 0;
  transition: all var(--duration-base) var(--ease-standard);
  font-family: inherit;
  text-decoration: none;
}
.daily-chip:hover {
  border-color: var(--color-primary-border);
  background: var(--color-primary-bg);
}
.daily-chip__date {
  font-size: var(--text-sm);
  font-weight: var(--weight-semibold);
  color: var(--color-text);
  white-space: nowrap;
}
.daily-chip__weekday {
  font-size: var(--text-xs);
  color: var(--color-text-tertiary);
}
.daily-chip--active {
  background: var(--color-primary-bg);
  border-color: var(--color-primary-border);
}
.daily-chip--active .daily-chip__date { color: var(--color-primary-hover); }
.daily-chip--active .daily-chip__weekday { color: var(--qdw-mint-700, #10b981); }

/* Layout */
.daily-layout { display: block; }
.daily-main { min-width: 0; }
.daily-sidebar { margin-top: var(--space-8); }

@media (min-width: 769px) {
  .daily-layout {
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: var(--space-6);
    align-items: start;
  }
  .daily-main { min-width: 0; }
  .daily-sidebar { margin-top: 0; }
}

/* Daily Masthead */
.daily-masthead {
  padding: var(--space-5) 0 var(--space-4);
  border-bottom: 2px solid var(--color-text-base);
  margin-bottom: var(--space-6);
}
.daily-masthead__vol {
  font-family: var(--font-mono, monospace);
  font-size: 11px;
  font-weight: var(--weight-medium);
  color: var(--color-text-quaternary);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: var(--space-1);
}
.daily-masthead__date {
  font-size: var(--text-2xl);
  font-weight: var(--weight-semibold);
  color: var(--color-text-base);
  letter-spacing: 0.04em;
  line-height: var(--leading-tight);
}

/* Daily Highlight */
.daily-highlight {
  background: var(--color-primary-bg); border-radius: var(--radius-md);
  padding: var(--space-3) var(--space-4); margin-bottom: var(--space-4);
  font-size: var(--text-sm); color: var(--color-text-secondary);
  border-left: 3px solid var(--color-primary);
}

/* Daily Section */
.daily-section { margin-bottom: var(--space-8); }
.daily-section__header {
  display: flex;
  align-items: flex-start;
  gap: var(--space-3);
  margin-bottom: var(--space-4);
  padding-bottom: var(--space-3);
  border-bottom: 1px solid var(--color-border-tertiary);
}
.daily-section__num {
  font-family: var(--font-mono, monospace);
  font-size: var(--text-display-sm, 24px);
  font-weight: var(--weight-semibold);
  color: var(--color-primary-hover);
  line-height: 1;
  letter-spacing: -0.02em;
  flex-shrink: 0;
  opacity: 0.7;
}
.daily-section__title {
  font-size: var(--text-xl);
  font-weight: var(--weight-semibold);
  color: var(--color-text-base);
  line-height: var(--leading-tight);
}
.daily-section__subtitle {
  font-family: var(--font-mono, monospace);
  font-size: 10px;
  font-weight: var(--weight-medium);
  color: var(--color-text-quaternary);
  letter-spacing: 0.1em;
  text-transform: uppercase;
}
.daily-section__titles { display: flex; flex-direction: column; gap: 2px; padding-top: 4px; }
.daily-section__body { display: flex; flex-direction: column; gap: var(--space-4); }

/* Source Tags */
.source-tag {
  display: inline-flex;
  align-items: center;
  font-size: 10px;
  font-weight: var(--weight-semibold);
  padding: 1px 6px;
  border-radius: var(--radius-xs);
  letter-spacing: 0.02em;
  line-height: 1.6;
  flex-shrink: 0;
}
.source-tag--official { background: var(--qdw-blue-100, #dbeafe); color: var(--qdw-blue-500, #3b82f6); }
.source-tag--media { background: var(--qdw-teal-100, #ccfbf1); color: var(--qdw-teal-500, #14b8a6); }
.source-tag--self { background: var(--qdw-orange-100, #ffedd5); color: var(--qdw-orange-500, #f97316); }
.source-tag--academic { background: var(--qdw-purple-100, #f3e8ff); color: var(--qdw-purple-500, #a855f7); }
.source-tag--policy { background: var(--qdw-red-100, #fee2e2); color: var(--qdw-red-500, #ef4444); }

/* Daily Card */
.daily-card {
  display: block;
  padding: var(--space-4);
  background: var(--color-bg-container);
  border: 1px solid var(--color-border-tertiary);
  border-radius: var(--radius-lg);
  transition: background var(--duration-base) var(--ease-standard),
              border-color var(--duration-base) var(--ease-standard),
              box-shadow var(--duration-base) var(--ease-standard);
  cursor: pointer;
  text-decoration: none;
  color: inherit;
}
.daily-card:hover {
  background: var(--color-primary-bg);
  border-color: var(--color-primary-border);
  box-shadow: var(--shadow-sm);
}
.daily-card__head {
  display: flex;
  align-items: center;
  gap: var(--feed-gap, 8px);
  margin-bottom: var(--space-2);
}
.daily-card__source {
  font-size: var(--text-xs);
  color: var(--color-text-tertiary);
  font-weight: var(--weight-medium);
}
.daily-card__title {
  font-size: var(--text-md);
  font-weight: var(--weight-semibold);
  color: var(--color-text-base);
  line-height: var(--leading-ui);
  margin-bottom: var(--space-2);
  letter-spacing: -0.005em;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.daily-card__summary {
  font-size: var(--text-sm);
  color: var(--color-text-secondary);
  line-height: var(--leading-body);
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* Pagination */
.daily-pagination {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--feed-gap, 8px);
  padding: var(--space-5) 0;
  margin-top: var(--space-4);
  border-top: 1px solid var(--color-border-tertiary);
}
.daily-pagination__link {
  display: inline-flex;
  align-items: center;
  gap: var(--space-1);
  padding: var(--space-2) var(--space-4);
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  color: var(--color-text-secondary);
  border: 1px solid var(--color-border-secondary);
  border-radius: var(--radius-lg);
  cursor: pointer;
  transition: all var(--duration-base) var(--ease-standard);
  white-space: nowrap;
  background: var(--color-bg-container);
  text-decoration: none;
}
.daily-pagination__link:hover {
  color: var(--color-primary-hover);
  border-color: var(--color-primary-border);
  background: var(--color-primary-bg);
}
.daily-pagination__archive {
  background: var(--color-primary-bg);
  border-color: var(--color-primary-border);
  color: var(--color-primary-hover);
  font-weight: var(--weight-semibold);
}
.daily-pagination__archive:hover {
  background: var(--color-primary-bg-hover);
  border-color: var(--color-primary-border-hover);
}
.daily-pagination__link--disabled {
  color: var(--color-text-quaternary);
  border-color: var(--color-border-tertiary);
  background: var(--color-fill-tertiary);
  cursor: not-allowed;
  opacity: 0.5;
  pointer-events: none;
}

/* Daily Footer */
.daily-footer {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--feed-gap, 8px);
  padding: var(--space-4) 0 var(--space-6);
  font-size: var(--text-xs);
  color: var(--color-text-quaternary);
}
.daily-footer svg { flex-shrink: 0; opacity: 0.5; }

/* Sidebar Panels */
.sidebar-panel {
  background: var(--color-bg-container);
  border: 1px solid var(--color-border-tertiary);
  border-radius: var(--radius-lg);
  overflow: hidden;
  margin-bottom: var(--space-5);
}
.sidebar-panel__header {
  padding: var(--space-3) var(--space-4);
  border-bottom: 1px solid var(--color-border-tertiary);
  background: var(--color-fill-tertiary);
}
.sidebar-panel__title {
  display: flex;
  align-items: center;
  gap: var(--feed-gap, 8px);
  font-size: var(--text-base);
  font-weight: var(--weight-semibold);
  color: var(--color-text-base);
}
.sidebar-panel__title svg { flex-shrink: 0; color: var(--color-primary-hover); opacity: 0.7; }

/* Past Issues */
.past-issues-list { padding: var(--space-2); }
.past-issue {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--space-3) var(--space-3);
  border-radius: var(--radius-md);
  cursor: pointer;
  transition: background var(--duration-fast) var(--ease-standard);
  text-decoration: none;
}
.past-issue:hover { background: var(--color-fill-tertiary); }
.past-issue + .past-issue { border-top: 1px solid var(--color-border-tertiary); }
.past-issue:hover + .past-issue,
.past-issue + .past-issue:hover { border-top-color: transparent; }
.past-issue__date {
  font-size: var(--text-sm);
  font-weight: var(--weight-medium);
  color: var(--color-text);
}
.past-issue__weekday {
  font-size: var(--text-xs);
  color: var(--color-text-quaternary);
  margin-left: var(--space-1);
}
.past-issue__count {
  font-family: var(--font-mono, monospace);
  font-size: var(--text-xs);
  color: var(--color-text-quaternary);
  white-space: nowrap;
}

/* Subscribe CTA */
.sidebar-panel--cta { border-color: var(--color-primary-border); }
.sidebar-panel--cta .sidebar-panel__header {
  background: var(--color-primary-bg);
  border-bottom-color: var(--color-primary-border);
}
.sidebar-panel--cta .sidebar-panel__title svg { opacity: 1; }
.subscribe-body { padding: var(--space-4); }
.subscribe-body__desc {
  font-size: var(--text-sm);
  color: var(--color-text-secondary);
  line-height: var(--leading-body);
  margin-bottom: var(--space-3);
}
.subscribe-form { display: flex; flex-direction: column; gap: var(--space-2); }
.subscribe-form__input {
  width: 100%;
  height: 36px;
  padding: 0 var(--space-3);
  border: 1px solid var(--color-border-secondary);
  border-radius: var(--radius-md);
  font-family: inherit;
  font-size: var(--text-sm);
  color: var(--color-text);
  background: var(--color-bg-container);
  outline: none;
  transition: border-color var(--duration-base) var(--ease-standard),
              box-shadow var(--duration-base) var(--ease-standard);
}
.subscribe-form__input:focus {
  border-color: var(--color-primary-border);
  box-shadow: 0 0 0 3px rgba(142, 229, 161, 0.12);
}
.subscribe-form__input::placeholder { color: var(--color-text-quaternary); }
.subscribe-form__btn {
  width: 100%;
  height: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: var(--radius-md);
  background: var(--color-primary);
  color: var(--qdw-ink-900, #1a1a1a);
  font-family: inherit;
  font-size: var(--text-sm);
  font-weight: var(--weight-semibold);
  cursor: pointer;
  transition: background var(--duration-base) var(--ease-standard);
}
.subscribe-form__btn:hover { background: var(--color-primary-hover); }
.subscribe-body__note {
  margin-top: var(--space-2);
  font-size: 11px;
  color: var(--color-text-quaternary);
  text-align: center;
}

/* Mobile Tab Bar - 仅移动端显示 */
@media (max-width: 768px) {
  .mobile-tabbar {
    display: flex;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: var(--color-bg-container);
    border-top: 1px solid var(--color-border-tertiary);
    z-index: 90;
    padding: var(--space-1) 0 env(safe-area-inset-bottom, var(--space-1));
  }
  .mobile-tab {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    padding: var(--space-2) 0;
    color: var(--color-text-quaternary);
    font-size: 10px;
    font-weight: var(--weight-medium);
    text-decoration: none;
    transition: color var(--duration-fast) var(--ease-standard);
  }
  .mobile-tab--active {
    color: var(--qdw-mint-700, #10b981);
  }
  .mobile-tab svg {
    opacity: 0.6;
  }
  .mobile-tab--active svg {
    opacity: 1;
  }

  body { padding-bottom: 60px; }
}

/* Responsive Breakpoints */
@media (min-width: 481px) {
  .daily-page { padding: 0 var(--space-5); }
  .daily-chips-bar { margin: 0 calc(-1 * var(--space-5)); padding: var(--space-3) var(--space-5); }
  .daily-masthead { padding: var(--space-6) 0 var(--space-5); }
  .daily-masthead__vol { font-size: var(--text-xs); }
  .daily-masthead__date { font-size: var(--text-display-sm); }
  .daily-section__num { font-size: var(--text-display-md); }
  .daily-section__title { font-size: var(--text-2xl); }
  .daily-card { padding: var(--space-5); }
  .daily-card__title { font-size: var(--text-xl); }
  .daily-pagination { gap: var(--space-4); }
}

@media (min-width: 769px) {
  .daily-page { padding: 0 var(--space-6); }
  .daily-chips-bar { margin: 0 calc(-1 * var(--space-6)); padding: var(--space-3) var(--space-6); }
  .daily-masthead { padding: var(--space-8) 0 var(--space-6); }
  .daily-masthead__date { font-size: 16px; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .daily-section { margin-bottom: var(--space-10); }
  .daily-section__header { gap: var(--space-4); }
  .daily-card__title { font-size: var(--text-lg); }
  .daily-card__summary { font-size: var(--text-base); }
  .daily-pagination { padding: var(--space-6) 0; }
}

@media (min-width: 1025px) {
  .daily-page { padding: 0 var(--space-6); }
  .daily-chips-bar { margin: 0 calc(-1 * var(--space-6)); padding: var(--space-3) var(--space-6); }
  .daily-layout {
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: var(--space-8);
    align-items: start;
  }
  .daily-sidebar {
    margin-top: 0;
    position: sticky;
    top: calc(var(--header-h, 60px) + 60px);
  }
  .daily-masthead { padding: var(--space-8) 0 var(--space-6); }
  .daily-masthead__date { font-size: var(--text-display-md); }
  .daily-section { margin-bottom: var(--space-10); }
  .daily-section__num { font-size: 42px; }
  .daily-section__title { font-size: var(--text-2xl); }
  .daily-card { padding: var(--space-5) var(--space-6); }
  .daily-card__title { font-size: var(--text-xl); }
  .subscribe-form { flex-direction: row; }
  .subscribe-form__input { flex: 1; }
  .subscribe-form__btn { width: auto; padding: 0 var(--space-5); white-space: nowrap; }
}

@media (max-width: 380px) {
  .daily-page { padding: 0 var(--space-3); }
  .daily-chips-bar { margin: 0 calc(-1 * var(--space-3)); padding: var(--space-2) var(--space-3); }
  .daily-chip { padding: var(--space-1) var(--space-3); }
  .daily-chip__date { font-size: var(--text-xs); }
  .daily-chip__weekday { font-size: 10px; }
  .daily-masthead__vol { font-size: 10px; }
  .daily-masthead__date { font-size: var(--text-xl); }
  .daily-section__num { font-size: var(--text-2xl); }
  .daily-section__title { font-size: var(--text-lg); }
  .daily-card { padding: var(--space-3); }
  .daily-card__title { font-size: var(--text-base); }
  .daily-card__summary { font-size: var(--text-xs); }
  .daily-pagination { flex-wrap: wrap; gap: var(--space-2); }
  .daily-pagination__link { font-size: var(--text-xs); padding: var(--space-2) var(--space-3); }
}
