/* AgendaCraft frontend styles — ported from the app's design tokens (index.css / tailwind.config.js) */

.agendacraft-wrap {
  --ac-bg: hsl(210, 35%, 15%);
  --ac-fg: hsl(210, 20%, 90%);
  --ac-card: hsl(210, 30%, 20%);
  --ac-primary: hsl(199, 100%, 50%);
  --ac-primary-fg: #ffffff;
  --ac-secondary: hsl(210, 50%, 35%);
  --ac-muted: hsl(210, 25%, 30%);
  --ac-muted-fg: hsl(210, 15%, 65%);
  --ac-accent: hsl(199, 100%, 50%);
  --ac-border: hsl(210, 25%, 27%);
  --ac-chart2: hsl(210, 100%, 60%);
  --ac-chart3: hsl(200, 90%, 55%);
  --ac-chart4: hsl(210, 85%, 60%);
  --ac-chart5: hsl(190, 80%, 60%);
  --ac-radius: 0.9rem;

  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  background: var(--ac-bg);
  color: var(--ac-fg);
  border-radius: 1.2rem;
  overflow: hidden;
  border: 1px solid var(--ac-border);
  max-width: 1200px;
  margin: 0 auto;
  box-sizing: border-box;
}
.agendacraft-wrap *, .agendacraft-wrap *::before, .agendacraft-wrap *::after {
  box-sizing: border-box;
}
.agendacraft-wrap a { color: var(--ac-primary); }
.agendacraft-wrap img { max-width: 100%; }

.ac-empty { text-align: center; color: var(--ac-muted-fg); padding: 60px 16px; font-style: italic; }

/* Day tabs */
.ac-tabs {
  display: flex;
  gap: 6px;
  padding: 16px;
  background: var(--ac-card);
  border-bottom: 1px solid var(--ac-border);
}
.ac-tab {
  flex: 1;
  padding: 10px 20px;
  border: none;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  background: transparent;
  color: var(--ac-muted-fg);
  transition: all 0.2s ease;
  font-family: inherit;
}
.ac-tab:hover { background: rgba(255,255,255,0.06); color: var(--ac-fg); }
.ac-tab.active { background: var(--ac-primary); color: var(--ac-primary-fg); box-shadow: 0 2px 14px rgba(0,180,255,0.35); }

.ac-panel { display: none; padding: 24px; }
.ac-panel.active { display: block; }

/* Section titles (renamable per day: pre/stage/post program headers) */
.ac-section-title { font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.5px; color: var(--ac-muted-fg); margin: 0 0 12px; }

/* Side events */
.ac-side-events { display: flex; flex-direction: column; gap: 12px; margin-bottom: 24px; }

.ac-side-card {
  background: var(--ac-card);
  border: 1px solid var(--ac-border);
  border-left: 4px solid var(--ac-primary);
  border-radius: var(--ac-radius);
  padding: 16px;
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.ac-side-icon {
  width: 32px; height: 32px; border-radius: 10px;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0; font-size: 15px;
}
.ac-side-body { flex: 1; min-width: 0; }
.ac-side-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 6px; }

/* Day 0 single column */
.ac-day0-list { max-width: 620px; margin: 0 auto; display: flex; flex-direction: column; gap: 12px; }

/* Stage blocks */
.ac-stage-block { margin-bottom: 24px; }
.ac-stage-block:last-child { margin-bottom: 0; }
.ac-stage-columns { display: grid; gap: 16px; grid-template-columns: 1fr; }
.ac-stage-columns.ac-cols-2 { grid-template-columns: 1fr; }
@media (min-width: 768px) {
  .ac-stage-columns.ac-cols-2 { grid-template-columns: 1fr 1fr; }
}
.ac-stage-col { display: flex; flex-direction: column; }
.ac-col-header { min-height: 44px; }
.ac-col-title { font-size: 12px; text-transform: uppercase; letter-spacing: 1.5px; font-weight: 700; color: var(--ac-muted-fg); margin: 0 0 8px; }
.ac-col-sessions { display: flex; flex-direction: column; gap: 12px; margin-top: 8px; }

.ac-sponsors { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.ac-sponsors-label { font-size: 10px; text-transform: uppercase; letter-spacing: 1px; color: var(--ac-muted-fg); font-weight: 700; }
.ac-sponsor-logo-sm { height: 28px; max-width: 90px; object-fit: contain; }
.ac-sponsor-logo { height: 40px; max-width: 140px; object-fit: contain; }
.ac-session-sponsors { margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--ac-border); }

/* Session cards */
.ac-session-card {
  background: var(--ac-card);
  border: 1px solid var(--ac-border);
  border-left: 4px solid var(--ac-primary);
  border-radius: var(--ac-radius);
  padding: 16px;
}
.ac-stage-accent-primary { border-left-color: var(--ac-primary); }
.ac-stage-accent-accent { border-left-color: var(--ac-accent); }
.ac-stage-accent-chart2 { border-left-color: var(--ac-chart2); }
.ac-stage-accent-chart3 { border-left-color: var(--ac-chart3); }
.ac-stage-accent-chart4 { border-left-color: var(--ac-chart4); }
.ac-stage-accent-chart5 { border-left-color: var(--ac-chart5); }

.ac-stage-sponsors-top { margin-bottom: 12px; }

.ac-session-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 6px; }
.ac-time { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: var(--ac-muted-fg); }
.ac-period-pill { font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; padding: 2px 10px; border-radius: 999px; background: rgba(255,255,255,0.08); color: var(--ac-muted-fg); }

.ac-title { font-size: 15px; font-weight: 700; color: var(--ac-fg); margin: 0 0 4px; }
.ac-desc { font-size: 13px; color: var(--ac-muted-fg); margin: 0 0 4px; line-height: 1.5; }
.ac-venue { display: flex; align-items: center; gap: 4px; font-size: 12px; color: var(--ac-muted-fg); margin-top: 8px; }
.ac-venue a { text-decoration: none; }
.ac-venue a:hover { text-decoration: underline; }

/* Session type badge - light pastel pills, matching SessionTypeBadge.jsx */
.ac-type-badge {
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 10px; font-weight: 700; border-radius: 999px;
  padding: 3px 10px; border: 1px solid transparent;
}
.ac-type-opening { background: #ecfdf5; color: #047857; border-color: #a7f3d0; }
.ac-type-keynote { background: #fffbeb; color: #b45309; border-color: #fde68a; }
.ac-type-panel   { background: #f5f3ff; color: #6d28d9; border-color: #ddd6fe; }
.ac-type-general { background: #f8fafc; color: #475569; border-color: #e2e8f0; }

/* Side event pill colors (semi-transparent tints on dark bg, matching AgendaPreview.jsx) */
.ac-pill { display: inline-flex; align-items: center; gap: 4px; font-size: 10px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.5px; padding: 3px 10px; border-radius: 999px; }
.ac-badge-chart5   { background: rgba(103, 210, 219, 0.15); color: #93c5fd; }
.ac-badge-chart4   { background: rgba(129, 154, 224, 0.15); color: #d8b4fe; }
.ac-badge-chart3   { background: rgba(80, 195, 219, 0.15); color: #5eead4; }
.ac-badge-primary  { background: rgba(0, 180, 255, 0.15); color: #93c5fd; }
.ac-badge-accent   { background: rgba(0, 180, 255, 0.15); color: #7dd3fc; }
.ac-badge-chart2   { background: rgba(77, 166, 255, 0.15); color: #bfdbfe; }
.ac-badge-muted    { background: rgba(255,255,255,0.08); color: var(--ac-muted-fg); }
.ac-badge-border   { background: rgba(255,255,255,0.06); color: var(--ac-muted-fg); }

.ac-accent-chart5  { border-left-color: var(--ac-chart5); }
.ac-accent-chart4  { border-left-color: var(--ac-chart4); }
.ac-accent-chart3  { border-left-color: var(--ac-chart3); }
.ac-accent-primary { border-left-color: var(--ac-primary); }
.ac-accent-accent  { border-left-color: var(--ac-accent); }
.ac-accent-chart2  { border-left-color: var(--ac-chart2); }
.ac-accent-muted   { border-left-color: var(--ac-muted-fg); }
.ac-accent-border  { border-left-color: var(--ac-border); }

/* Speakers */
.ac-speakers { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--ac-border); }
@media (max-width: 480px) { .ac-speakers { grid-template-columns: 1fr; } }
.ac-speaker { display: flex; align-items: center; gap: 8px; min-width: 0; }
.ac-speaker-avatar {
  width: 44px; height: 44px; border-radius: 50%; overflow: hidden; flex-shrink: 0;
  background: var(--ac-muted); display: flex; align-items: center; justify-content: center;
  border: 2px solid rgba(0,180,255,0.2);
}
.ac-speaker-avatar img { width: 100%; height: 100%; object-fit: cover; }
.ac-speaker-meta { min-width: 0; }
.ac-speaker-name { font-size: 12px; font-weight: 600; margin: 0; line-height: 1.3; color: var(--ac-fg); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ac-speaker-title { font-size: 10px; color: var(--ac-muted-fg); margin: 0; line-height: 1.3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }