/*
 * DarkShoppe · Mensajes / Marketplace · UI legible 2026.09.16
 * -------------------------------------------------------------
 * Este archivo se carga ÚLTIMO y aísla el aspecto visual de la app
 * mensajes para impedir que reglas históricas/globales vuelvan a poner
 * texto blanco sobre superficies claras.
 */

:root{
  --msg16-bg:#f2f5f8;
  --msg16-surface:#ffffff;
  --msg16-surface-soft:#f7f9fc;
  --msg16-text:#101828;
  --msg16-text-2:#344054;
  --msg16-muted:#667085;
  --msg16-line:#d9e2ec;
  --msg16-navy:#0d1829;
  --msg16-navy-2:#111f34;
  --msg16-green:#18c9a4;
  --msg16-green-dark:#087f69;
  --msg16-danger:#e5484d;
  --msg16-shadow:0 14px 34px rgba(15,23,42,.08);
}

/* El marketplace controla su propio color independientemente del shell global. */
body .ms-shell{
  color:var(--msg16-text)!important;
  font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important;
}
body .ms-shell a{ text-decoration:none; }

/* ------------------------------------------------------------------
   TOPBAR DE MENSAJES: siempre superficie clara + texto oscuro
   ------------------------------------------------------------------ */
body .ms-shell .ms-topbar{
  background:var(--msg16-surface)!important;
  color:var(--msg16-text)!important;
  border:1px solid var(--msg16-line)!important;
  box-shadow:var(--msg16-shadow)!important;
}
body .ms-shell .ms-topbar .ms-brand,
body .ms-shell .ms-topbar .ms-brand strong{
  color:var(--msg16-text)!important;
  -webkit-text-fill-color:var(--msg16-text)!important;
}
body .ms-shell .ms-topbar .ms-brand .material-icons{
  color:var(--msg16-green-dark)!important;
  -webkit-text-fill-color:var(--msg16-green-dark)!important;
}
body .ms-shell .ms-topbar .ms-nav-link{
  background:#f2f5f8!important;
  color:var(--msg16-text-2)!important;
  border:1px solid transparent!important;
  -webkit-text-fill-color:var(--msg16-text-2)!important;
}
body .ms-shell .ms-topbar .ms-nav-link .material-icons{
  color:#64748b!important;
  -webkit-text-fill-color:#64748b!important;
}
body .ms-shell .ms-topbar .ms-nav-link:hover{
  background:#e9eef4!important;
  color:var(--msg16-text)!important;
}
body .ms-shell .ms-topbar .ms-nav-link--primary{
  background:var(--msg16-green)!important;
  color:#04130f!important;
  border-color:rgba(24,201,164,.25)!important;
  -webkit-text-fill-color:#04130f!important;
}
body .ms-shell .ms-topbar .ms-nav-link--primary .material-icons{
  color:#04130f!important;
  -webkit-text-fill-color:#04130f!important;
}

/* ------------------------------------------------------------------
   HERO + RESUMEN: todo claro y legible
   ------------------------------------------------------------------ */
body .ms-shell .ms-hero,
body .ms-shell .ms-page-head{
  background:linear-gradient(145deg,#fff,#f8fafc)!important;
  color:var(--msg16-text)!important;
  border:1px solid var(--msg16-line)!important;
  box-shadow:0 18px 44px rgba(15,23,42,.08)!important;
}
body .ms-shell .ms-hero h1,
body .ms-shell .ms-page-head h1,
body .ms-shell .ms-hero h2,
body .ms-shell .ms-page-head h2{
  color:var(--msg16-text)!important;
  -webkit-text-fill-color:var(--msg16-text)!important;
}
body .ms-shell .ms-hero p,
body .ms-shell .ms-page-head p{
  color:#53647a!important;
  -webkit-text-fill-color:#53647a!important;
}
body .ms-shell .ms-eyebrow,
body .ms-shell .ms-eyebrow *{
  color:var(--msg16-green-dark)!important;
  -webkit-text-fill-color:var(--msg16-green-dark)!important;
}
body .ms-shell .ms-hero-card{
  background:#f1f5f9!important;
  color:var(--msg16-text)!important;
  border:1px solid var(--msg16-line)!important;
}
body .ms-shell .ms-hero-card strong{
  color:var(--msg16-text)!important;
  -webkit-text-fill-color:var(--msg16-text)!important;
}
body .ms-shell .ms-hero-card small{
  color:#617086!important;
  -webkit-text-fill-color:#617086!important;
}
body .ms-shell .ms-hero-card .material-icons{ color:var(--msg16-green)!important; }

/* Botones claros y suaves. */
body .ms-shell .ms-btn--primary{
  background:var(--msg16-green)!important;
  color:#031711!important;
  -webkit-text-fill-color:#031711!important;
}
body .ms-shell .ms-btn--primary .material-icons{ color:#031711!important; }
body .ms-shell .ms-btn--soft{
  background:#ddf8f1!important;
  color:#087f69!important;
  border:1px solid #a8eadb!important;
  -webkit-text-fill-color:#087f69!important;
}
body .ms-shell .ms-btn--ghost{
  background:#fff!important;
  color:var(--msg16-text)!important;
  border:1px solid var(--msg16-line)!important;
  -webkit-text-fill-color:var(--msg16-text)!important;
}
body .ms-shell .ms-btn--danger{
  background:var(--msg16-danger)!important;
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}

/* Estadísticas claras. */
body .ms-shell .ms-stat{
  background:#fff!important;
  border-color:var(--msg16-line)!important;
  color:var(--msg16-text)!important;
}
body .ms-shell .ms-stat span{
  color:#53647a!important;
  -webkit-text-fill-color:#53647a!important;
}
body .ms-shell .ms-stat strong{
  color:var(--msg16-text)!important;
  -webkit-text-fill-color:var(--msg16-text)!important;
}

/* Filtros: único bloque intencionalmente oscuro. */
body .ms-shell .ms-filter-panel{
  background:linear-gradient(135deg,var(--msg16-navy),var(--msg16-navy-2))!important;
  color:#fff!important;
  border:1px solid #26364e!important;
}
body .ms-shell .ms-filter-panel .ms-filter-title,
body .ms-shell .ms-filter-panel .ms-filter-title strong,
body .ms-shell .ms-filter-panel label,
body .ms-shell .ms-filter-panel label>span{
  color:#fff!important;
  -webkit-text-fill-color:#fff!important;
}
body .ms-shell .ms-filter-panel input,
body .ms-shell .ms-filter-panel select{
  background:#fff!important;
  color:var(--msg16-text)!important;
  -webkit-text-fill-color:var(--msg16-text)!important;
  border:1px solid #cfd8e4!important;
}
body .ms-shell .ms-filter-panel input::placeholder{color:#78869a!important;opacity:1!important;}
body .ms-shell .ms-filter-panel .ms-btn--ghost{
  background:#202c3e!important;
  color:#fff!important;
  border-color:#3b4a60!important;
  -webkit-text-fill-color:#fff!important;
}

/* ------------------------------------------------------------------
   CATÁLOGO / CARDS
   ------------------------------------------------------------------ */
body .ms-shell .ms-section-head,
body .ms-shell .ms-section-head *,
body .ms-shell .ms-section-head h2,
body .ms-shell .ms-section-head small{
  color:var(--msg16-text)!important;
  -webkit-text-fill-color:var(--msg16-text)!important;
}
body .ms-shell .ms-section-head small{color:#5c6b80!important;-webkit-text-fill-color:#5c6b80!important;}
body .ms-shell .ms-card{
  background:#fff!important;
  color:var(--msg16-text)!important;
  border:1px solid var(--msg16-line)!important;
  box-shadow:0 12px 30px rgba(15,23,42,.07)!important;
}
body .ms-shell .ms-card__body{ color:var(--msg16-text)!important; }
body .ms-shell .ms-card__title,
body .ms-shell .ms-card__title:visited{
  color:#162033!important;
  -webkit-text-fill-color:#162033!important;
}
body .ms-shell .ms-card__description{
  color:#5c6b80!important;
  -webkit-text-fill-color:#5c6b80!important;
}
body .ms-shell .ms-card__meta,
body .ms-shell .ms-card__meta span,
body .ms-shell .ms-thumb-strip,
body .ms-shell .ms-thumb-strip span{
  color:#77869a!important;
  -webkit-text-fill-color:#77869a!important;
}
body .ms-shell .ms-card .ms-price,
body .ms-shell .ms-price{
  color:#087f69!important;
  -webkit-text-fill-color:#087f69!important;
}
body .ms-shell .ms-owner-tools a{ color:#344054!important; }
body .ms-shell .ms-owner-tools .danger{ color:#d92d20!important; }
body .ms-shell .ms-category-pill{
  background:var(--msg16-green)!important;
  color:#04130f!important;
  -webkit-text-fill-color:#04130f!important;
}
body .ms-shell .ms-media-badge{color:#fff!important;-webkit-text-fill-color:#fff!important;}
body .ms-shell .ms-empty-media,
body .ms-shell .ms-empty-media *{color:#64748b!important;-webkit-text-fill-color:#64748b!important;}

/* ------------------------------------------------------------------
   DETALLE / COMPRA / CREAR / ELIMINAR
   Superficies claras => texto oscuro sin depender del CSS viejo.
   ------------------------------------------------------------------ */
body .ms-shell .ms-form-card,
body .ms-shell .ms-content-card,
body .ms-shell .ms-detail-card,
body .ms-shell .ms-delete-card,
body .ms-shell .ms-order-summary,
body .ms-shell .ms-payment-card,
body .ms-shell .ms-payment-panel,
body .ms-shell .ms-qr-card,
body .ms-shell .ms-payment-info-box{
  background:#fff!important;
  color:var(--msg16-text)!important;
  border-color:var(--msg16-line)!important;
}
body .ms-shell .ms-form-card h1,
body .ms-shell .ms-form-card h2,
body .ms-shell .ms-form-card h3,
body .ms-shell .ms-content-card h1,
body .ms-shell .ms-content-card h2,
body .ms-shell .ms-content-card h3,
body .ms-shell .ms-detail-card h1,
body .ms-shell .ms-detail-card h2,
body .ms-shell .ms-detail-card h3,
body .ms-shell .ms-delete-card h1,
body .ms-shell .ms-order-summary h1,
body .ms-shell .ms-order-summary h2,
body .ms-shell .ms-payment-card h1,
body .ms-shell .ms-payment-card h2{
  color:var(--msg16-text)!important;
  -webkit-text-fill-color:var(--msg16-text)!important;
}
body .ms-shell .ms-detail-short,
body .ms-shell .ms-content-card p,
body .ms-shell .ms-detail-card p,
body .ms-shell .ms-richtext,
body .ms-shell .ms-richtext p,
body .ms-shell .ms-note,
body .ms-shell .ms-delete-card p,
body .ms-shell .ms-order-summary p,
body .ms-shell .ms-payment-lead,
body .ms-shell .ms-payment-card p{
  color:#53647a!important;
  -webkit-text-fill-color:#53647a!important;
}
body .ms-shell .ms-section-title h2,
body .ms-shell .ms-section-title h3,
body .ms-shell .ms-section-title strong{
  color:var(--msg16-text)!important;
  -webkit-text-fill-color:var(--msg16-text)!important;
}
body .ms-shell .ms-section-title p{color:#667085!important;-webkit-text-fill-color:#667085!important;}
body .ms-shell .ms-field,
body .ms-shell .ms-field>span,
body .ms-shell .ms-check-line,
body .ms-shell .ms-form-errors{
  color:var(--msg16-text-2)!important;
  -webkit-text-fill-color:var(--msg16-text-2)!important;
}
body .ms-shell .ms-field input,
body .ms-shell .ms-field select,
body .ms-shell .ms-field textarea,
body .ms-shell .ms-comment-form textarea,
body .ms-shell .ms-inline-form input,
body .ms-shell .ms-inline-form select{
  background:#fff!important;
  color:var(--msg16-text)!important;
  -webkit-text-fill-color:var(--msg16-text)!important;
  border-color:#cfd8e4!important;
}
body .ms-shell input::placeholder,
body .ms-shell textarea::placeholder{color:#7c899c!important;opacity:1!important;}
body .ms-shell select option{background:#fff!important;color:var(--msg16-text)!important;}
body .ms-shell .ms-price-panel{
  background:#eafbf6!important;
  color:var(--msg16-text)!important;
  border:1px solid #bcefe1!important;
}
body .ms-shell .ms-price-panel small{color:#53647a!important;-webkit-text-fill-color:#53647a!important;}
body .ms-shell .ms-price-panel strong{color:#087f69!important;-webkit-text-fill-color:#087f69!important;}

/* ------------------------------------------------------------------
   EDITOR: permanece oscuro, pero todos sus textos se fijan a colores
   claros para que no herede el tema global blanco.
   ------------------------------------------------------------------ */
body .ms-shell.ms-editor-page .ms-editor-hero,
body .ms-shell.ms-editor-page .ms-editor-preview,
body .ms-shell.ms-editor-page .ms-editor-card,
body .ms-shell.ms-editor-page .ms-editor-help{
  background:linear-gradient(145deg,#121e31,#0b1525)!important;
  color:#f7fbff!important;
  border-color:rgba(255,255,255,.12)!important;
}
body .ms-shell.ms-editor-page .ms-editor-hero h1,
body .ms-shell.ms-editor-page .ms-editor-preview h2,
body .ms-shell.ms-editor-page .ms-editor-card strong,
body .ms-shell.ms-editor-page .ms-editor-section-head h2,
body .ms-shell.ms-editor-page .ms-editor-help strong,
body .ms-shell.ms-editor-page .ms-editor-preview__label{
  color:#f7fbff!important;
  -webkit-text-fill-color:#f7fbff!important;
}
body .ms-shell.ms-editor-page .ms-editor-hero p,
body .ms-shell.ms-editor-page .ms-editor-preview p,
body .ms-shell.ms-editor-page .ms-editor-card small,
body .ms-shell.ms-editor-page .ms-editor-help p,
body .ms-shell.ms-editor-page .ms-editor-status{
  color:#c5d2e4!important;
  -webkit-text-fill-color:#c5d2e4!important;
}
body .ms-shell.ms-editor-page .ms-editor-control,
body .ms-shell.ms-editor-page .ms-editor-control>span{color:#dbe6f5!important;-webkit-text-fill-color:#dbe6f5!important;}
body .ms-shell.ms-editor-page input,
body .ms-shell.ms-editor-page select,
body .ms-shell.ms-editor-page textarea{
  background:#fff!important;
  color:var(--msg16-text)!important;
  -webkit-text-fill-color:var(--msg16-text)!important;
}

/* Mensajes y estados vacíos. */
body .ms-shell .ms-flash{background:#fff!important;color:var(--msg16-text)!important;border-color:var(--msg16-line)!important;}
body .ms-shell .ms-flash p{color:var(--msg16-text)!important;-webkit-text-fill-color:var(--msg16-text)!important;}
body .ms-shell .ms-empty-state{
  background:#fff!important;
  color:var(--msg16-text)!important;
  border:1px dashed #cdd7e3!important;
}
body .ms-shell .ms-empty-state h3{color:var(--msg16-text)!important;-webkit-text-fill-color:var(--msg16-text)!important;}
body .ms-shell .ms-empty-state p{color:#667085!important;-webkit-text-fill-color:#667085!important;}

/* ------------------------------------------------------------------
   MOBILE / iOS / Samsung Internet
   ------------------------------------------------------------------ */
@media(max-width:760px){
  body .ms-shell{width:100%!important;margin:10px auto 28px!important;padding:0 12px!important;}
  body .ms-shell .ms-topbar{padding:10px!important;gap:8px!important;flex-wrap:wrap!important;}
  body .ms-shell .ms-brand strong{display:inline!important;font-size:14px!important;}
  body .ms-shell .ms-nav-actions{width:auto!important;flex:1 1 auto!important;justify-content:flex-end!important;}
  body .ms-shell .ms-nav-link{min-height:42px!important;padding:9px 11px!important;font-size:12px!important;}
  body .ms-shell .ms-hero,
  body .ms-shell .ms-page-head{padding:22px!important;border-radius:20px!important;}
  body .ms-shell .ms-hero h1{font-size:clamp(30px,9vw,42px)!important;}
  body .ms-shell .ms-filter-panel{grid-template-columns:1fr!important;padding:15px!important;}
  body .ms-shell .ms-filter-title{grid-column:auto!important;}
  body .ms-shell .ms-filter-actions{display:grid!important;grid-template-columns:1fr 1fr!important;width:100%!important;}
  body .ms-shell .ms-stat-grid,
  body .ms-shell .ms-card-grid{grid-template-columns:1fr!important;}
  body .ms-shell input,
  body .ms-shell select,
  body .ms-shell textarea{font-size:16px!important;}
}
@media(max-width:460px){
  body .ms-shell{padding:0 9px!important;}
  body .ms-shell .ms-topbar .ms-brand{width:100%!important;justify-content:flex-start!important;}
  body .ms-shell .ms-nav-actions{width:100%!important;display:grid!important;grid-template-columns:1fr!important;}
  body .ms-shell .ms-nav-link{width:100%!important;}
  body .ms-shell .ms-filter-actions{grid-template-columns:1fr!important;}
}