/* ============================================================================
   StartupCredits.org — Multi-Theme Frontend Design Engine
   1. default : Classic List Directory (1-Column Horizontal Rows)
   2. bento   : Founders Bento Grid (2-Column Navy & Cyan Glass Bento Cards)
   3. emerald : Venture Emerald Matrix (3-Column Carbon & Emerald Dossier Grid)
   ============================================================================ */

/* ============================================================================
   THEME 2: FOUNDERS BENTO GRID (data-site-theme="bento")
   ============================================================================ */
html.dark[data-site-theme="bento"],
html.dark[data-site-theme="bento"] body {
  --md-sys-color-background: #070b14 !important;
  --md-sys-color-surface: #0f172a !important;
  --md-sys-color-surface-container-low: #0d1424 !important;
  --md-sys-color-surface-container-high: #162038 !important;
  --md-sys-color-primary: #38bdf8 !important;
  --md-sys-color-on-primary: #061326 !important;
  --bg: #070b14 !important;
  background-color: #070b14 !important;
}

html:not(.dark)[data-site-theme="bento"],
html:not(.dark)[data-site-theme="bento"] body {
  --md-sys-color-background: #f1f5f9 !important;
  --md-sys-color-surface: #ffffff !important;
  --md-sys-color-surface-container-low: #ffffff !important;
  --md-sys-color-surface-container-high: #e2e8f0 !important;
  --md-sys-color-primary: #2563eb !important;
  background-color: #f1f5f9 !important;
}

html[data-site-theme="bento"] .nav-drawer {
  background: #090f1d !important;
  border-right: 1px solid rgba(56, 189, 248, 0.14) !important;
}
html:not(.dark)[data-site-theme="bento"] .nav-drawer {
  background: #ffffff !important;
  border-right: 1px solid #cbd5e1 !important;
}

html[data-site-theme="bento"] .site-header {
  background: rgba(7, 11, 20, 0.88) !important;
  backdrop-filter: blur(16px) !important;
  border-bottom: 1px solid rgba(56, 189, 248, 0.14) !important;
}
html:not(.dark)[data-site-theme="bento"] .site-header {
  background: rgba(255, 255, 255, 0.9) !important;
  border-bottom: 1px solid #cbd5e1 !important;
}

html[data-site-theme="bento"] .nav-item.active {
  background: linear-gradient(90deg, rgba(37, 99, 235, 0.24), rgba(56, 189, 248, 0.08)) !important;
  border-left: 3px solid #38bdf8 !important;
  border-radius: 10px !important;
}

/* Responsive 3-Col (Wide) -> 2-Col (Laptop/Tablet) -> 1-Col (Mobile) Bento Grid */
html[data-site-theme="bento"] .resource-list {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 16px !important;
}

@media (max-width: 1420px) {
  html[data-site-theme="bento"] .resource-list {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

html[data-site-theme="bento"] .list-item {
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  border-radius: 16px !important;
  padding: 20px !important;
  border: 1px solid rgba(56, 189, 248, 0.16) !important;
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.92), rgba(10, 16, 30, 0.98)) !important;
  box-shadow: 0 10px 28px -12px rgba(0, 0, 0, 0.5) !important;
  transition: transform 0.18s ease, border-color 0.18s ease, box-shadow 0.18s ease !important;
}
html[data-site-theme="bento"] .item-title-row {
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 8px !important;
}
html:not(.dark)[data-site-theme="bento"] .list-item {
  background: #ffffff !important;
  border: 1px solid #cbd5e1 !important;
  box-shadow: 0 6px 18px rgba(15, 23, 42, 0.06) !important;
}

html[data-site-theme="bento"] .list-item:hover {
  transform: translateY(-3px) !important;
  border-color: rgba(56, 189, 248, 0.48) !important;
  box-shadow: 0 14px 34px -10px rgba(37, 99, 235, 0.28) !important;
}

html[data-site-theme="bento"] .credits-amount,
html[data-site-theme="bento"] .credits-badge,
html[data-site-theme="bento"] .deal-credit-tag {
  background: rgba(56, 189, 248, 0.14) !important;
  color: #38bdf8 !important;
  border: 1px solid rgba(56, 189, 248, 0.32) !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
}
html:not(.dark)[data-site-theme="bento"] .credits-amount,
html:not(.dark)[data-site-theme="bento"] .credits-badge {
  background: #eff6ff !important;
  color: #1d4ed8 !important;
  border-color: #93c5fd !important;
}

html[data-site-theme="bento"] .new-card,
html[data-site-theme="bento"] .trending-card,
html[data-site-theme="bento"] .startup-overview-section,
html[data-site-theme="bento"] .offer-panel,
html[data-site-theme="bento"] .deals-filter-section,
html[data-site-theme="bento"] .blog-card {
  border-radius: 16px !important;
  border: 1px solid rgba(56, 189, 248, 0.18) !important;
  background: #0d1527 !important;
}
html:not(.dark)[data-site-theme="bento"] .new-card,
html:not(.dark)[data-site-theme="bento"] .trending-card,
html:not(.dark)[data-site-theme="bento"] .startup-overview-section,
html:not(.dark)[data-site-theme="bento"] .offer-panel,
html:not(.dark)[data-site-theme="bento"] .blog-card,
html:not(.dark)[data-site-theme="bento"] .discovery-card {
  background: #f1f5f9 !important;
  border: 1.5px solid #cbd5e1 !important;
}

html[data-site-theme="bento"] .btn-primary,
html[data-site-theme="bento"] .visit-btn {
  background: linear-gradient(135deg, #2563eb, #0284c7) !important;
  color: #ffffff !important;
  border-radius: 10px !important;
  font-weight: 700 !important;
}

/* ============================================================================
   THEME 3: VENTURE EMERALD MATRIX (data-site-theme="emerald")
   ============================================================================ */
html.dark[data-site-theme="emerald"],
html.dark[data-site-theme="emerald"] body {
  --md-sys-color-background: #080d0b !important;
  --md-sys-color-surface: #101814 !important;
  --md-sys-color-surface-container-low: #0d1411 !important;
  --md-sys-color-surface-container-high: #17241e !important;
  --md-sys-color-primary: #10b981 !important;
  --md-sys-color-on-primary: #041f14 !important;
  --bg: #080d0b !important;
  background-color: #080d0b !important;
}

html:not(.dark)[data-site-theme="emerald"],
html:not(.dark)[data-site-theme="emerald"] body {
  --md-sys-color-background: #f3f7f5 !important;
  --md-sys-color-surface: #ffffff !important;
  --md-sys-color-surface-container-low: #ffffff !important;
  --md-sys-color-surface-container-high: #dcfce7 !important;
  --md-sys-color-primary: #059669 !important;
  background-color: #f3f7f5 !important;
}

html[data-site-theme="emerald"] .nav-drawer {
  background: #0a100d !important;
  border-right: 1px solid #1c2b24 !important;
}
html:not(.dark)[data-site-theme="emerald"] .nav-drawer {
  background: #ffffff !important;
  border-right: 1px solid #d1fae5 !important;
}

html[data-site-theme="emerald"] .site-header {
  background: #0a100d !important;
  border-bottom: 1px solid #1c2b24 !important;
}
html:not(.dark)[data-site-theme="emerald"] .site-header {
  background: #ffffff !important;
  border-bottom: 1px solid #d1fae5 !important;
}

html[data-site-theme="emerald"] .nav-item.active {
  background: rgba(16, 185, 129, 0.14) !important;
  border-left: 3px solid #10b981 !important;
  border-radius: 6px !important;
  color: #34d399 !important;
}

/* 3-Column High-Density Venture Dossier Grid */
html[data-site-theme="emerald"] .resource-list {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
  gap: 16px !important;
}

html[data-site-theme="emerald"] .list-item {
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: space-between !important;
  border-radius: 10px !important;
  padding: 18px !important;
  border: 1px solid #1e2e26 !important;
  border-top: 3px solid #10b981 !important;
  background: #101814 !important;
  transition: transform 0.16s ease, border-color 0.16s ease !important;
}
html:not(.dark)[data-site-theme="emerald"] .list-item {
  background: #ffffff !important;
  border: 1px solid #d1d5db !important;
  border-top: 3px solid #059669 !important;
}

html[data-site-theme="emerald"] .list-item:hover {
  transform: translateY(-3px) !important;
  border-color: #10b981 !important;
}

html[data-site-theme="emerald"] .item-leading .item-logo {
  width: 48px !important;
  height: 48px !important;
  border-radius: 10px !important;
  margin-bottom: 6px !important;
}

html[data-site-theme="emerald"] .item-title-row {
  flex-direction: column !important;
  align-items: flex-start !important;
  gap: 8px !important;
}

html[data-site-theme="emerald"] .item-trailing {
  margin-left: 0 !important;
}

html[data-site-theme="emerald"] .credits-amount,
html[data-site-theme="emerald"] .credits-badge,
html[data-site-theme="emerald"] .deal-credit-tag {
  background: rgba(16, 185, 129, 0.14) !important;
  color: #34d399 !important;
  border: 1px solid rgba(16, 185, 129, 0.35) !important;
  border-radius: 6px !important;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace !important;
  font-size: 11.5px !important;
  font-weight: 700 !important;
}
html:not(.dark)[data-site-theme="emerald"] .credits-amount,
html:not(.dark)[data-site-theme="emerald"] .credits-badge {
  background: #ecfdf5 !important;
  color: #047857 !important;
  border-color: #6ee7b7 !important;
}

html[data-site-theme="emerald"] .new-card,
html[data-site-theme="emerald"] .trending-card,
html[data-site-theme="emerald"] .startup-overview-section,
html[data-site-theme="emerald"] .offer-panel,
html[data-site-theme="emerald"] .deals-filter-section,
html[data-site-theme="emerald"] .blog-card {
  border-radius: 10px !important;
  border: 1px solid #1e2e26 !important;
  background: #101814 !important;
}
html:not(.dark)[data-site-theme="emerald"] .new-card,
html:not(.dark)[data-site-theme="emerald"] .trending-card,
html:not(.dark)[data-site-theme="emerald"] .startup-overview-section,
html:not(.dark)[data-site-theme="emerald"] .offer-panel,
html:not(.dark)[data-site-theme="emerald"] .blog-card {
  background: #ffffff !important;
  border: 1px solid #d1d5db !important;
}

html[data-site-theme="emerald"] .btn-primary,
html[data-site-theme="emerald"] .visit-btn {
  background: #10b981 !important;
  color: #041f14 !important;
  border-radius: 8px !important;
  font-weight: 700 !important;
}

/* Responsive Breakpoints for Bento & Emerald Grids */
@media (max-width: 1180px) {
  html[data-site-theme="emerald"] .resource-list {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }
}

@media (max-width: 767px) {
  html[data-site-theme="bento"] .resource-list,
  html[data-site-theme="emerald"] .resource-list {
    grid-template-columns: minmax(0, 1fr) !important;
  }
}
