/* Business dashboard — Mi Entidad redesigned.
 * Modules: hero · KPI cards · cards (reviews donut, overview bars) ·
 * próximos eventos · acciones rápidas · entity info collapsible.
 * Pure SVG charts (no external lib).
 */

/* ── Hero ──────────────────────────────────────────────────────────── */

.bd-hero {
  display: flex;
  gap: 18px;
  align-items: center;
  padding: 22px 24px;
  margin-bottom: 22px;
  background:
    radial-gradient(120% 140% at 0% 0%, rgba(249,115,22,.10), transparent 60%),
    radial-gradient(120% 140% at 100% 100%, rgba(251,146,60,.06), transparent 70%),
    var(--bg-card-solid, #fff);
  border: 1px solid var(--border);
  border-radius: 20px;
  box-shadow: 0 18px 40px -28px rgba(15, 23, 42, .25);
  position: relative;
  overflow: hidden;
}
.bd-hero::after {
  content: "";
  position: absolute;
  top: 0; left: 24px; right: 24px;
  height: 3px;
  background: linear-gradient(90deg, #F97316, #FB923C, #FDBA74);
  border-radius: 3px;
}

.bd-hero-logo {
  width: 72px;
  height: 72px;
  border-radius: 16px;
  object-fit: cover;
  flex-shrink: 0;
  box-shadow: 0 8px 24px -10px rgba(249, 115, 22, .35);
}
.bd-hero-logo-fallback {
  background: linear-gradient(135deg, #F97316, #FB923C);
  color: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 28px;
  font-weight: 800;
}

.bd-hero-text { flex: 1; min-width: 0; }

.bd-hero-badges {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
  margin-bottom: 6px;
}

.bd-badge {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 9px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .02em;
}
.bd-badge-cat {
  background: rgba(249, 115, 22, .12);
  color: var(--primary, #ea580c);
}
.bd-badge-ok {
  background: rgba(34, 197, 94, .12);
  color: #16a34a;
}

.bd-hero-name {
  margin: 0 0 4px;
  font-size: 24px;
  font-weight: 800;
  letter-spacing: -.4px;
  color: var(--text);
}

.bd-hero-desc {
  margin: 0;
  font-size: 13px;
  color: var(--text-secondary);
  max-width: 60ch;
  line-height: 1.5;
}

/* ── KPIs ──────────────────────────────────────────────────────────── */

.bd-kpis {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 14px;
  margin-bottom: 22px;
}

.bd-kpi {
  display: flex;
  gap: 14px;
  align-items: flex-start;
  padding: 18px 20px;
  background: var(--bg-card-solid, #fff);
  border: 1px solid var(--border);
  border-radius: 18px;
  text-align: left;
  cursor: pointer;
  transition: transform .18s, box-shadow .18s, border-color .18s;
  position: relative;
  overflow: hidden;
}
button.bd-kpi { font: inherit; color: inherit; }
.bd-kpi:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 28px -18px rgba(249, 115, 22, .35);
  border-color: rgba(249, 115, 22, .35);
}
.bd-kpi::before {
  content: "";
  position: absolute;
  top: 0; left: 0;
  width: 4px; height: 100%;
  background: linear-gradient(180deg, #F97316, #FB923C);
  border-radius: 4px;
}
.bd-kpi-orange::before { background: linear-gradient(180deg, #F97316, #FB923C); }
.bd-kpi-amber::before  { background: linear-gradient(180deg, #F59E0B, #FBBF24); }
.bd-kpi-yellow::before { background: linear-gradient(180deg, #EAB308, #FACC15); }
.bd-kpi-rose::before   { background: linear-gradient(180deg, #F43F5E, #FB7185); }

.bd-kpi-icon {
  width: 42px;
  height: 42px;
  flex-shrink: 0;
  border-radius: 12px;
  background: rgba(249, 115, 22, .1);
  color: var(--primary);
  display: inline-flex;
  align-items: center;
  justify-content: center;
}
.bd-kpi-amber  .bd-kpi-icon { background: rgba(245, 158, 11, .12); color: #d97706; }
.bd-kpi-yellow .bd-kpi-icon { background: rgba(234, 179, 8, .12);  color: #ca8a04; }
.bd-kpi-rose   .bd-kpi-icon { background: rgba(244, 63, 94, .1);  color: #e11d48; }

.bd-kpi-body { flex: 1; min-width: 0; }
.bd-kpi-label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .06em;
  color: var(--text-muted);
}
.bd-kpi-value {
  font-size: 28px;
  font-weight: 800;
  letter-spacing: -.5px;
  color: var(--text);
  margin: 2px 0;
}
.bd-kpi-sub {
  font-size: 12px;
  color: var(--text-secondary);
}

/* ── Generic card used by reviews / overview / events / actions ───── */

.bd-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin-bottom: 14px;
}
@media (max-width: 860px) { .bd-grid { grid-template-columns: 1fr; } }

.bd-card {
  padding: 20px 22px;
  background: var(--bg-card-solid, #fff);
  border: 1px solid var(--border);
  border-radius: 18px;
  box-shadow: 0 14px 28px -22px rgba(15, 23, 42, .2);
}

.bd-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 14px;
}

.bd-card-title {
  margin: 0;
  font-size: 15px;
  font-weight: 800;
  letter-spacing: -.2px;
  color: var(--text);
}

.bd-card-link {
  background: none;
  border: 0;
  color: var(--primary, #ea580c);
  font-size: 12.5px;
  font-weight: 700;
  cursor: pointer;
  padding: 4px 6px;
  border-radius: 6px;
  transition: background .15s;
}
.bd-card-link:hover { background: rgba(249, 115, 22, .08); }

/* ── Reviews donut ────────────────────────────────────────────────── */

.bd-reviews {
  display: flex;
  align-items: center;
  gap: 18px;
}

.bd-reviews-donut {
  position: relative;
  width: 160px;
  height: 160px;
  flex-shrink: 0;
}
.bd-reviews-donut-center {
  position: absolute;
  inset: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.bd-reviews-donut-num {
  font-size: 32px;
  font-weight: 800;
  letter-spacing: -.5px;
  color: var(--text);
}
.bd-reviews-donut-sub {
  font-size: 11px;
  font-weight: 600;
  color: var(--text-muted);
  text-transform: uppercase;
  letter-spacing: .05em;
}

.bd-reviews-legend {
  flex: 1;
  min-width: 0;
}
.bd-reviews-legend-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 0;
  border-bottom: 1px dashed var(--border);
}
.bd-reviews-legend-row:last-child { border-bottom: 0; }
.bd-reviews-legend-dot {
  display: inline-block;
  width: 10px; height: 10px;
  border-radius: 999px;
}
.bd-reviews-legend-label {
  flex: 1;
  font-size: 13px;
  color: var(--text-secondary);
  font-weight: 500;
}
.bd-reviews-legend-num {
  font-size: 14px;
  font-weight: 800;
  color: var(--text);
}
.bd-reviews-legend-foot {
  margin-top: 10px;
  font-size: 11.5px;
  color: var(--text-muted);
}

/* ── Overview bars ────────────────────────────────────────────────── */

.bd-overview {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.bd-overview-row {
  display: grid;
  grid-template-columns: 100px 1fr 36px;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 8px 10px;
  background: transparent;
  border: 0;
  border-radius: 10px;
  cursor: pointer;
  text-align: left;
  transition: background .15s;
}
.bd-overview-row:hover { background: rgba(249, 115, 22, .05); }

.bd-overview-label {
  font-size: 12.5px;
  font-weight: 600;
  color: var(--text-secondary);
}
.bd-overview-bar {
  position: relative;
  height: 10px;
  background: rgba(15, 23, 42, .05);
  border-radius: 999px;
  overflow: hidden;
}
.bd-overview-bar-fill {
  position: absolute;
  inset: 0;
  width: 0;
  border-radius: 999px;
  box-shadow: 0 2px 6px -2px rgba(0,0,0,.15) inset;
}
.bd-overview-value {
  font-size: 13px;
  font-weight: 800;
  text-align: right;
  color: var(--text);
}

/* ── Próximos eventos ─────────────────────────────────────────────── */

.bd-events {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.bd-event {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 10px 12px;
  background: rgba(249, 115, 22, .04);
  border: 1px solid rgba(249, 115, 22, .12);
  border-radius: 12px;
}
.bd-event-date {
  width: 52px;
  height: 56px;
  flex-shrink: 0;
  border-radius: 10px;
  background: linear-gradient(180deg, #F97316, #EA580C);
  color: #fff;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 14px -8px rgba(249,115,22,.55);
}
.bd-event-day {
  font-size: 20px;
  font-weight: 800;
  line-height: 1;
}
.bd-event-month {
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .08em;
  margin-top: 2px;
  opacity: .9;
}
.bd-event-info { flex: 1; min-width: 0; }
.bd-event-title {
  font-size: 14px;
  font-weight: 700;
  color: var(--text);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.bd-event-sub {
  font-size: 12px;
  color: var(--text-muted);
}

.bd-empty {
  padding: 24px 12px;
  text-align: center;
  color: var(--text-muted);
  font-size: 13px;
}
.bd-empty-icon {
  font-size: 32px;
  margin-bottom: 8px;
}

/* ── Acciones rápidas ─────────────────────────────────────────────── */

.bd-actions {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}
.bd-action {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  background: var(--bg-input, #f8fafc);
  border: 1px solid var(--border);
  border-radius: 12px;
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
  text-align: left;
  cursor: pointer;
  transition: background .15s, border-color .15s, transform .12s;
}
.bd-action:hover {
  background: rgba(249, 115, 22, .07);
  border-color: rgba(249, 115, 22, .35);
}
.bd-action:active { transform: scale(.98); }
.bd-action-icon {
  width: 32px;
  height: 32px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(249, 115, 22, .12);
  color: var(--primary, #ea580c);
  border-radius: 9px;
  flex-shrink: 0;
}
.bd-action:hover .bd-action-icon {
  background: rgba(249, 115, 22, .2);
}
.bd-action-label { flex: 1; }
.bd-action-arrow {
  color: var(--text-muted);
  flex-shrink: 0;
}

/* ── Entity info (collapsible) ────────────────────────────────────── */

.bd-info {
  margin-top: 14px;
  padding: 12px 20px;
  background: var(--bg-card-solid, #fff);
  border: 1px solid var(--border);
  border-radius: 16px;
}
.bd-info[open] { padding-bottom: 18px; }
.bd-info-summary {
  list-style: none;
  cursor: pointer;
  font-size: 13px;
  font-weight: 700;
  color: var(--text);
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6px 0;
  user-select: none;
}
.bd-info-summary::-webkit-details-marker { display: none; }
.bd-info-chev { transition: transform .2s; color: var(--text-muted); }
.bd-info[open] .bd-info-chev { transform: rotate(180deg); }

.bd-info-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 14px;
  margin-top: 14px;
}
.bd-info-item { min-width: 0; }
.bd-info-label {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: .05em;
  color: var(--text-muted);
  margin-bottom: 3px;
}
.bd-info-value {
  font-size: 13.5px;
  color: var(--text);
  word-break: break-word;
}
.bd-info-socials { display: flex; gap: 6px; }
.bd-info-social {
  width: 30px; height: 30px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background: rgba(249,115,22,.1);
  color: var(--primary);
  border-radius: 8px;
  font-weight: 800;
  text-decoration: none;
  transition: background .15s, color .15s;
}
.bd-info-social:hover { background: var(--primary); color: #fff; }
.bd-info-social-ig { background: rgba(236, 72, 153, .1); color: #db2777; }
.bd-info-social-ig:hover { background: #db2777; color: #fff; }
.bd-info-social-web { background: rgba(59, 130, 246, .1); color: #2563eb; }
.bd-info-social-web:hover { background: #2563eb; color: #fff; }

/* ── Reduced motion ───────────────────────────────────────────────── */

@media (prefers-reduced-motion: reduce) {
  .bd-kpi:hover { transform: none; }
  .bd-reviews-donut-arc { transition: none !important; }
  .bd-overview-bar-fill { transition: none !important; }
}