/* MascotBook · rediseño visual (admin)
   Solo aplica con body.admin-view-mascot (EliteCard no se ve afectado).
   Carga después de admin-elite.css y mascot-dashboard.css. */

body.admin-view-mascot,
body.admin-view-mascot .admin-root.view-mascot {
  --mb-bg: #ffffff;
  --mb-primary: #007bff;
  --mb-primary-hover: #0069d9;
  --mb-primary-soft: #e7f3ff;
  --mb-accent: #ff8c00;
  --mb-accent-soft: #fff4e6;
  --mb-radius-btn: 8px;
  --mb-text: #111827;
  --mb-text-muted: #6b7280;

  --mascot-primary: #007bff;
  --mascot-primary-light: #e7f3ff;
  --mascot-accent: #ff8c00;
  --mascot-neutral-50: #ffffff;
  --mascot-neutral-100: #f3f4f6;
  --mascot-neutral-200: #e5e7eb;
  --mascot-neutral-700: #374151;
  --mascot-neutral-900: #111827;

  --ec-mb-purple-deep: #0056b3;
  --ec-mb-purple-mid: #007bff;
  --ec-mb-pink-accent: #0069d9;
  --ec-mb-gold: #ff8c00;
  --ec-mb-gold-bright: #ffb347;

  --accent: #007bff;
  --accent-hover: #0069d9;
  --accent-soft: #e7f3ff;
  --mascot-color: #ff8c00;
  --bg-main: #ffffff;
}

/* —— Fondos blancos —— */
body.admin-view-mascot {
  background: var(--mb-bg) !important;
  color: var(--mb-text);
  font-family: "Montserrat", system-ui, -apple-system, sans-serif;
  -webkit-font-smoothing: antialiased;
}

body.admin-view-mascot #app,
body.admin-view-mascot .admin-root.view-mascot .main,
body.admin-view-mascot .admin-root.view-mascot #panel-contenido,
body.admin-view-mascot .admin-root.view-mascot #panel-dashboard,
body.admin-view-mascot .admin-root.view-mascot .sidebar,
body.admin-view-mascot .admin-root.view-mascot .preview-col {
  background: var(--mb-bg) !important;
}

body.admin-view-mascot .admin-root.view-mascot .sidebar {
  border-right-color: var(--mascot-neutral-200) !important;
  background: var(--mb-bg) !important;
}

body.admin-view-mascot .admin-root.view-mascot .preview-col {
  background: var(--mb-bg) !important;
  border-left-color: var(--mascot-neutral-200) !important;
}

/* —— Tipografía legible —— */
body.admin-view-mascot .admin-root.view-mascot h1,
body.admin-view-mascot .admin-root.view-mascot h2,
body.admin-view-mascot .admin-root.view-mascot h3,
body.admin-view-mascot .admin-root.view-mascot .mb-dash-title,
body.admin-view-mascot .admin-root.view-mascot .mascot-panel-card__title {
  color: var(--mb-text);
  letter-spacing: -0.01em;
}

body.admin-view-mascot .admin-root.view-mascot p,
body.admin-view-mascot .admin-root.view-mascot .mb-dash-lead,
body.admin-view-mascot .admin-root.view-mascot .admin-card-hint {
  color: var(--mb-text-muted);
}

/* —— Botones principales (azul #007BFF, 8px) —— */
body.admin-view-mascot .admin-root.view-mascot .btn-save,
body.admin-view-mascot .admin-root.view-mascot .btn-solid,
body.admin-view-mascot .admin-root.view-mascot #btn-ec-dash-goto-mascot-contenido,
body.admin-view-mascot .admin-root.view-mascot .btn-ec-mascot-nueva,
body.admin-view-mascot .admin-root.view-mascot #ec-sidebar-btn-nueva-mascota.ec-sidebar-mis-perfiles__new,
body.admin-view-mascot .admin-root.view-mascot .ec-sidebar-mis-perfiles__new:not(.ec-sidebar-memorial-sky-btn),
body.admin-view-mascot #form-mascot .btn-save,
body.admin-view-mascot #form-mascot .mb-medal-cta__btn,
body.admin-view-mascot #admin-mb-medal-modal .mb-medal-modal__pay,
body.admin-view-mascot .admin-modal-panel .btn-solid,
body.admin-view-mascot button[class*="primary"],
body.admin-view-mascot .btn-primary,
body.admin-view-mascot button[class*="guardar"],
body.admin-view-mascot button[class*="crear"]:not(.ec-sidebar-memorial-sky-btn) {
  background: var(--mb-primary) !important;
  border: none !important;
  border-radius: var(--mb-radius-btn) !important;
  color: #ffffff !important;
  font-weight: 600 !important;
  box-shadow: 0 2px 8px rgba(0, 123, 255, 0.28) !important;
  transition: background 0.15s ease, box-shadow 0.15s ease, transform 0.15s ease !important;
}

body.admin-view-mascot .admin-root.view-mascot .btn-save:hover:not(:disabled),
body.admin-view-mascot .admin-root.view-mascot .btn-solid:hover:not(:disabled),
body.admin-view-mascot .admin-root.view-mascot #btn-ec-dash-goto-mascot-contenido:hover,
body.admin-view-mascot .admin-root.view-mascot .btn-ec-mascot-nueva:hover,
body.admin-view-mascot .admin-root.view-mascot #ec-sidebar-btn-nueva-mascota.ec-sidebar-mis-perfiles__new:hover,
body.admin-view-mascot #form-mascot .btn-save:hover:not(:disabled),
body.admin-view-mascot #form-mascot .mb-medal-cta__btn:hover,
body.admin-view-mascot #admin-mb-medal-modal .mb-medal-modal__pay:hover,
body.admin-view-mascot button[class*="primary"]:hover,
body.admin-view-mascot .btn-primary:hover,
body.admin-view-mascot button[class*="guardar"]:hover {
  background: var(--mb-primary-hover) !important;
  filter: none !important;
  box-shadow: 0 4px 12px rgba(0, 123, 255, 0.35) !important;
}

/* Nav / tabs activos = acción principal */
body.admin-view-mascot .admin-root.view-mascot .sidebar .nav-tab.active,
body.admin-view-mascot .admin-root.view-mascot .nav-tab.active,
html[data-ec-admin] body.admin-view-mascot .admin-root.view-mascot .sidebar-nav .nav-tab.active {
  background: var(--mb-primary) !important;
  border-color: var(--mb-primary) !important;
  color: #ffffff !important;
  box-shadow: 0 2px 8px rgba(0, 123, 255, 0.25) !important;
  border-radius: var(--mb-radius-btn) !important;
}

body.admin-view-mascot #form-mascot .mascot-tabs.mb-work-tabs .mb-tab-btn.active {
  color: var(--mb-primary) !important;
  border-bottom-color: var(--mb-primary) !important;
  background: var(--mb-primary-soft) !important;
}

/* FAB móvil “nueva mascota” */
body.admin-view-mascot .admin-root.view-mascot #ec-sidebar-btn-nueva-mascota.ec-sidebar-mis-perfiles__new {
  background: var(--mb-primary) !important;
  box-shadow: 0 8px 24px rgba(0, 123, 255, 0.35) !important;
}

body.admin-view-mascot .admin-root.view-mascot #ec-sidebar-btn-nueva-mascota.ec-sidebar-mis-perfiles__new::before,
body.admin-view-mascot .admin-root.view-mascot #ec-sidebar-btn-nueva-mascota.ec-sidebar-mis-perfiles__new i,
body.admin-view-mascot .admin-root.view-mascot #ec-sidebar-btn-nueva-mascota.ec-sidebar-mis-perfiles__new span {
  color: #ffffff !important;
}

/* Secundarios: borde neutro, hover azul suave */
body.admin-view-mascot #form-mascot .btn-outline:not(.m-gallery-slot-delete):not(.btn-admin-chip--danger),
body.admin-view-mascot #form-mascot .btn-mascot-add,
body.admin-view-mascot #form-mascot .btn-dash-lost-save,
body.admin-view-mascot #form-mascot .btn-qr,
body.admin-view-mascot .admin-root.view-mascot .btn-outline {
  background: var(--mb-bg) !important;
  border: 1px solid var(--mascot-neutral-200) !important;
  color: var(--mb-text) !important;
  border-radius: var(--mb-radius-btn) !important;
}

body.admin-view-mascot #form-mascot .btn-outline:hover:not(:disabled),
body.admin-view-mascot #form-mascot .btn-mascot-add:hover:not(:disabled),
body.admin-view-mascot #form-mascot .btn-dash-lost-save:hover:not(:disabled),
body.admin-view-mascot #form-mascot .btn-qr:hover:not(:disabled),
body.admin-view-mascot .admin-root.view-mascot .btn-outline:hover {
  border-color: var(--mb-primary) !important;
  color: var(--mb-primary) !important;
  background: var(--mb-primary-soft) !important;
}

/* —— Naranja: detalles, iconos, estados destacados —— */
body.admin-view-mascot .mb-dash-eyebrow,
body.admin-view-mascot .mb-medal-modal__eyebrow,
body.admin-view-mascot .ec-sidebar-mis-perfiles__head-icon,
body.admin-view-mascot .mascot-side-logo,
body.admin-view-mascot [class*="mascotbook"] [class*="label"],
body.admin-view-mascot [class*="mascotbook"] [class*="badge"],
body.admin-view-mascot [class*="universo-aparte"],
body.admin-view-mascot .text-mascot,
body.admin-view-mascot .hub-mascot .hub-eyebrow {
  color: var(--mb-accent) !important;
}

body.admin-view-mascot .admin-trial-days-badge,
body.admin-view-mascot #form-mascot .mb-medal-cta__badge,
body.admin-view-mascot #m-gallery-slots .m-gallery-slot-badge,
body.admin-view-mascot .admin-mb-qr-lock__badge,
body.admin-view-mascot .ec-sidebar-mis-perfiles__btn--active {
  color: var(--mb-primary) !important;
}

body.admin-view-mascot .admin-trial-days-badge {
  background: var(--mb-accent-soft) !important;
  border: 1px solid rgba(255, 140, 0, 0.35) !important;
}

body.admin-view-mascot #form-mascot .mb-medal-cta__text li::before,
body.admin-view-mascot #admin-mb-medal-modal .mb-medal-modal__benefits li::before {
  color: var(--mb-accent) !important;
}

body.admin-view-mascot .mb-dash-card.active .mb-dash-card-icon,
body.admin-view-mascot .mb-dash-card:hover .mb-dash-card-icon {
  color: var(--mb-accent) !important;
}

/* Perfil activo en franja “stories” */
body.admin-view-mascot #panel-contenido .ec-sidebar-mis-perfiles__btn--active {
  border-color: rgba(255, 140, 0, 0.95) !important;
  background: var(--mb-accent-soft) !important;
  color: var(--mb-primary) !important;
  box-shadow:
    0 0 0 2px #fff,
    0 0 0 4px var(--mb-accent),
    0 0 20px rgba(255, 140, 0, 0.35) !important;
}

body.admin-view-mascot .ec-mb-stories-scroll {
  scrollbar-color: rgba(255, 140, 0, 0.45) transparent;
}

body.admin-view-mascot .ec-mb-stories-scroll::-webkit-scrollbar-thumb {
  background: rgba(255, 140, 0, 0.45) !important;
}

body.admin-view-mascot .admin-demo-banner i,
body.admin-view-mascot .admin-demo-banner__link {
  color: var(--mb-accent) !important;
}

body.admin-view-mascot #form-mascot #mascot-admin-memorial-ribbon {
  border-left-color: var(--mb-accent) !important;
}

body.admin-view-mascot #form-mascot #mascot-admin-memorial-ribbon i {
  color: var(--mb-accent) !important;
}

/* Perfil activo / historias: acento naranja en borde destacado */
body.admin-view-mascot #ec-sidebar-active-mascot-name:not(.hidden) {
  color: var(--mb-accent) !important;
  background: var(--mb-accent-soft) !important;
}

/* Tarjetas y paneles sobre blanco */
body.admin-view-mascot #form-mascot .mascot-tab-container,
body.admin-view-mascot #form-mascot .mascot-tab-panels,
body.admin-view-mascot .ec-sidebar-mis-perfiles,
body.admin-view-mascot .mascot-panel-card {
  background: var(--mb-bg) !important;
  border-color: var(--mascot-neutral-200) !important;
}

body.admin-view-mascot #panel-contenido .ec-mb-profiles-strip.ec-sidebar-mis-perfiles:not(.hidden) {
  background: var(--mb-bg) !important;
  border: 1px solid var(--mascot-neutral-200) !important;
  box-shadow: 0 1px 3px rgba(17, 24, 39, 0.06) !important;
}

/* Cielo de mascotas: secundario (no primario azul) */
body.admin-view-mascot .ec-sidebar-memorial-sky-btn {
  background: var(--mb-bg) !important;
  border: 1px solid var(--mascot-neutral-200) !important;
  color: var(--mb-text) !important;
  border-radius: var(--mb-radius-btn) !important;
}

body.admin-view-mascot .ec-sidebar-memorial-sky-btn__inner .fa-cloud {
  color: var(--mb-accent) !important;
}

body.admin-view-mascot .ec-sidebar-memorial-sky-btn:hover {
  border-color: var(--mb-accent) !important;
  background: var(--mb-accent-soft) !important;
}

/* Guardar en preview: solo MascotBook (EliteCard en preview-column.css) */
body.admin-view-mascot .preview-col-save-btn--mascot {
  background: var(--mb-primary) !important;
  color: #fff !important;
  border-radius: 8px !important;
  border: none !important;
  box-shadow: 0 4px 14px rgba(0, 123, 255, 0.32) !important;
}

body.admin-view-mascot .preview-col-save-btn--mascot:hover {
  background: var(--mb-primary-hover) !important;
}

/* Danger / eliminar: sin cambios funcionales */
body.admin-view-mascot #form-mascot .btn-admin-chip--danger,
body.admin-view-mascot #form-mascot #btn-delete-mascot-profile {
  border-radius: var(--mb-radius-btn) !important;
}