/* UX-PROFILE-1.0 / 2.0 — dos productos (leche | carne) sobre una plataforma */

:root {
  /* Solo identidad carne en #pg-carne (no aplica al Dashboard Inicio lechero) */
  --piel-carne-hero-bg: linear-gradient(168deg, #f4f2ef 0%, #e8e4dc 42%, #ddd6c8 100%);
  --piel-carne-hero-border: #c4bcb0;
  --piel-carne-xhero-visual: url('../icons/carne-hub-xhero-brahman.png?v=20260520carneXhero');
}

/* UX-PROFILE-2.0 — visibilidad por producto en Inicio (fuente de verdad; no togglear hidden en JS) */
#pg-dash[data-piel-inicio='leche'] [data-piel-modulo='carne'] {
  display: none !important;
}

#pg-dash[data-piel-inicio='carne'] [data-piel-modulo='leche'] {
  display: none !important;
}

/* Nav / legacy: respaldo con body[data-perfil] */
body[data-perfil='carne'] [data-piel-modulo='leche'],
body.manto-demo-vitrina-carne [data-piel-modulo='leche'],
body.manto-piel-carne [data-piel-modulo='leche'] {
  display: none !important;
}

body[data-perfil='carne'] [data-piel-modulo='carne'],
body.manto-demo-vitrina-carne [data-piel-modulo='carne'],
body.manto-piel-carne [data-piel-modulo='carne'] {
  display: block;
}

body[data-perfil='leche'] [data-piel-modulo='carne'],
body.manto-demo-vitrina-leche [data-piel-modulo='carne'] {
  display: none !important;
}

/* Legacy IDs (respaldo si falta data-piel-modulo) */
body[data-perfil='carne'] #dash-anomalias-section,
body[data-perfil='carne'] #dash-compar-sem-section,
body[data-perfil='carne'] #dash-score-descarte-section,
body[data-perfil='carne'] section[aria-labelledby='dash-inicio-tit-top5'],
body.manto-demo-vitrina-carne #dash-anomalias-section,
body.manto-demo-vitrina-carne #dash-compar-sem-section,
body.manto-demo-vitrina-carne #dash-score-descarte-section,
body.manto-demo-vitrina-carne section[aria-labelledby='dash-inicio-tit-top5'] {
  display: none !important;
}

body[data-perfil='carne'] .dash-perfil-carne-section,
body.manto-demo-vitrina-carne .dash-perfil-carne-section {
  display: block;
}

/* Inicio carne: orden visual de bloques (refuerzo tras reordenarInicioCarne) */
#pg-dash[data-piel-inicio='carne'] #dash-hoy-finca-section {
  order: 10;
}
#pg-dash[data-piel-inicio='carne'] #dash-perfil-carne-section {
  order: 20;
}
#pg-dash[data-piel-inicio='carne'] #dash-listos-venta-section {
  order: 30;
}
#pg-dash[data-piel-inicio='carne'] #dash-potrero-recom-section {
  order: 40;
}
#pg-dash[data-piel-inicio='carne'] #dash-noticias-section {
  order: 50;
}
#pg-dash[data-piel-inicio='carne'] #dash-clima-section {
  order: 60;
}
#pg-dash[data-piel-inicio='carne'] .dash-tab-panel--inicio .section-content {
  display: flex;
  flex-direction: column;
}

/* Noticias visibles en piel carne (el HTML trae display:none hasta cargar RSS) */
#pg-dash[data-piel-inicio='carne'] #dash-noticias-section.dash-noticias-widget--pending,
body[data-perfil='carne'] #dash-noticias-section,
body.manto-piel-carne #dash-noticias-section {
  display: block !important;
}

#pg-dash[data-piel-inicio='carne'] #dash-alertas-carne-inicio {
  display: none !important;
}

/* Tab Reproducción oculto en piel carne */
body[data-perfil='carne'] .guia-app-flujo--leche {
  display: none !important;
}
body[data-perfil='leche'] .guia-app-flujo--carne,
body:not([data-perfil='carne']) .guia-app-flujo--carne {
  display: none !important;
}

body[data-perfil='carne'] #pg-dash .dash-tabs-bar .dash-tab-btn[data-dash-tab-idx='1'],
body.manto-demo-vitrina-carne #pg-dash .dash-tabs-bar .dash-tab-btn[data-dash-tab-idx='1'] {
  display: none !important;
}

/* Animales listos para venta */
.dash-listos-venta-widget__hit {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 56px;
  padding: 12px 14px;
  border: var(--borde-fino, 1px solid #cbd5e1);
  border-radius: 12px;
  background: var(--gris-0, #fff);
  cursor: pointer;
  text-align: left;
  font-family: 'Segoe UI', Tahoma, Arial, sans-serif;
  box-shadow: var(--manto-serio-panel-inset, inset 0 1px 0 rgba(255, 255, 255, 0.9)),
    var(--manto-serio-panel-drop, 0 1px 2px rgba(15, 23, 42, 0.06));
}

.dash-listos-venta-widget__hit:hover {
  background: var(--gris-50, #f8fafc);
}

.dash-listos-venta-widget__main {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.dash-listos-venta-widget__val {
  font-size: 28px;
  font-weight: 900;
  color: var(--texto-fuerte, #0f172a);
  line-height: 1.1;
}

.dash-listos-venta-widget__money {
  font-size: 18px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  color: #166534;
  line-height: 1.2;
  letter-spacing: -0.02em;
}

.dash-listos-venta-widget__msg {
  font-size: 12px;
  font-weight: 600;
  color: var(--texto-suave, #64748b);
}

/* WOW-002 · banner económico en lista listos venta (Hoy en la finca) */
.hoy-finca-econ-banner {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 12px 14px;
  margin-bottom: 8px;
  border: var(--borde-fino, 1px solid #cbd5e1);
  border-radius: 12px;
  background: linear-gradient(168deg, #fff 0%, #f1f5f9 55%, #e2e8f0 100%);
  box-shadow: var(--manto-serio-panel-inset, inset 0 1px 0 rgba(255, 255, 255, 0.9));
}

.hoy-finca-econ-banner__lbl {
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--texto-suave, #64748b);
}

.hoy-finca-econ-banner__val {
  font-size: 22px;
  font-weight: 900;
  font-variant-numeric: tabular-nums;
  color: #166534;
  letter-spacing: -0.02em;
}

.hoy-finca-econ-banner__sub {
  font-size: 11px;
  font-weight: 600;
  color: var(--texto-base, #334155);
  line-height: 1.35;
}

/* WOW-004 · chip único de prioridad venta (listos) */
.hoy-finca-pri-resumen {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-bottom: 8px;
}

.hoy-finca-pri {
  display: inline-flex;
  align-items: center;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.02em;
  line-height: 1.2;
  white-space: nowrap;
  border: 1px solid transparent;
}

.hoy-finca-pri--ahora {
  color: #166534;
  background: #dcfce7;
  border-color: #86efac;
}

.hoy-finca-pri--observar {
  color: #92400e;
  background: #fef3c7;
  border-color: #fcd34d;
}

.hoy-finca-pri--ceba {
  color: var(--texto-suave, #64748b);
  background: var(--gris-100, #f1f5f9);
  border-color: var(--gris-300, #cbd5e1);
}

.hoy-finca-item__pri {
  margin-bottom: 4px;
}

/* Alertas sanitarias + potrero recomendado */
.dash-alertas-carne-host {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.dash-alertas-carne-row {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 12px;
  border: var(--borde-fino, 1px solid #cbd5e1);
  border-radius: 10px;
  background: var(--gris-0, #fff);
}

.dash-alertas-carne-row__band {
  width: 4px;
  align-self: stretch;
  border-radius: 4px;
  flex-shrink: 0;
}

.dash-alertas-carne-row__body {
  flex: 1;
  min-width: 0;
}

.dash-alertas-carne-row__tit {
  font-size: 13px;
  font-weight: 800;
  color: var(--texto-fuerte, #0f172a);
}

.dash-alertas-carne-row__det {
  font-size: 12px;
  font-weight: 600;
  color: var(--texto-suave, #64748b);
  margin-top: 2px;
}

.dash-potrero-recom-card {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.dash-potrero-recom-card__nombre {
  font-size: 16px;
  font-weight: 900;
  color: var(--texto-fuerte, #0f172a);
}

.dash-potrero-recom-card__meta {
  font-size: 12px;
  font-weight: 600;
  color: var(--texto-suave, #64748b);
}

.dash-potrero-recom-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.dash-potrero-recom-actions .btn {
  min-height: 40px;
  flex: 1 1 140px;
}

#pg-dash[data-piel-inicio='carne'] .dash-perfil-carne-cta,
#pg-dash[data-piel-inicio='carne'] .dash-potrero-recom-actions .btn {
  min-height: 38px !important;
  height: 38px !important;
  padding: 0 14px !important;
  border-radius: 12px !important;
  border-color: var(--dash-accent-hover) !important;
  background: var(--dash-accent-soft) !important;
  color: var(--dash-accent-hover) !important;
  -webkit-text-fill-color: var(--dash-accent-hover) !important;
  font-weight: 800;
}

/* Demo lechera: no forzar ocultamiento lácteo (plataforma completa) */
body.manto-demo-vitrina-leche #dash-anomalias-section,
body.manto-demo-vitrina-leche #dash-compar-sem-section,
body.manto-demo-vitrina-leche .dash-tab-panel[data-dash-tab='0'] > section[aria-labelledby='dash-inicio-tit-top5'] {
  display: revert !important;
}

.dash-perfil-carne-section__sub {
  margin: 2px 0 0;
  font-size: 12px;
  font-weight: 600;
  color: var(--texto-suave, #64748b);
}

.dash-perfil-carne-kpis {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
}

@media (min-width: 640px) {
  .dash-perfil-carne-kpis {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (min-width: 900px) {
  .dash-perfil-carne-kpis {
    grid-template-columns: repeat(5, minmax(0, 1fr));
  }
}

.dash-perfil-carne-kpi {
  background: var(--gris-0, #fff);
  border: var(--borde-fino, 1px solid #cbd5e1);
  border-radius: var(--manto-serio-radius, 5px);
  box-shadow: var(--manto-serio-panel-inset, inset 0 1px 0 rgba(255, 255, 255, 0.9)),
    var(--manto-serio-panel-drop, 0 1px 2px rgba(15, 23, 42, 0.06));
  padding: 10px 12px;
  min-height: 64px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 4px;
}

.dash-perfil-carne-kpi__lbl {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.03em;
  text-transform: uppercase;
  color: var(--texto-suave, #64748b);
}

.dash-perfil-carne-kpi__val {
  font-size: 18px;
  font-weight: 900;
  color: var(--texto-fuerte, #0f172a);
  line-height: 1.2;
}

.dash-perfil-carne-actions {
  margin-top: 10px;
}

.dash-perfil-carne-cta {
  width: 100%;
  min-height: 44px;
}

/* Demo login — selector perfil */
.login-demo-perfil-row {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 8px;
  margin-top: 10px;
  padding: 0 4px;
}

.login-demo-perfil-row__lbl {
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: rgba(240, 253, 244, 0.75);
  text-align: center;
}

.login-demo-perfil-row__btns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px;
}

.login-demo-perfil-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 6px 10px;
  border-radius: 10px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  background: rgba(255, 255, 255, 0.06);
  color: #f8fafc;
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
  font-family: 'Segoe UI', Tahoma, Arial, sans-serif;
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}

.login-demo-perfil-btn__ico {
  width: 28px;
  height: 28px;
  object-fit: contain;
  flex-shrink: 0;
  display: block;
}

.login-demo-perfil-btn__lbl {
  line-height: 1.1;
}

.login-demo-perfil-btn:hover {
  border-color: rgba(255, 255, 255, 0.42);
  background: rgba(255, 255, 255, 0.1);
}

.login-demo-perfil-btn.active {
  border-color: rgba(255, 255, 255, 0.72);
  background: rgba(255, 255, 255, 0.14);
  color: #ffffff;
  box-shadow:
    0 0 0 1px rgba(255, 255, 255, 0.22) inset,
    0 2px 8px rgba(0, 0, 0, 0.18);
}

/* Sheet «Más» en nav carne */
.nav-mas-perfil-overlay {
  position: fixed;
  inset: 0;
  z-index: 9990;
  background: rgba(15, 23, 42, 0.45);
}

.nav-mas-perfil-sheet {
  position: fixed;
  left: 0;
  right: 0;
  bottom: calc(56px + env(safe-area-inset-bottom, 0px));
  z-index: 9991;
  padding: 0 10px 10px;
  pointer-events: none;
}

.nav-mas-perfil-sheet[data-open='1'] {
  pointer-events: auto;
}

.nav-mas-perfil-sheet__inner {
  pointer-events: auto;
  background: var(--gris-0, #fff);
  border: var(--borde-fino, 1px solid #cbd5e1);
  border-radius: 14px;
  box-shadow: 0 8px 28px rgba(15, 23, 42, 0.18);
  padding: 12px;
  max-height: min(52vh, 360px);
  overflow-y: auto;
}

.nav-mas-perfil-sheet__tit {
  font-size: 13px;
  font-weight: 800;
  color: var(--texto-fuerte, #0f172a);
  margin-bottom: 10px;
}

.nav-mas-perfil-sheet__grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
}

.nav-mas-perfil-sheet__grid .nb {
  display: flex !important;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 72px;
  width: 100%;
  margin: 0;
}

/* Modal admin — elegir perfil (fincas sin perfilProductivo) */
.perfil-productivo-modal {
  z-index: 10050;
}

.perfil-productivo-mbox {
  max-width: 420px;
  margin: 12vh auto 0;
  padding: 18px 16px 16px;
  background: var(--gris-0, #fff);
  border: var(--borde-fino, 1px solid #cbd5e1);
  border-radius: 12px;
  box-shadow: 0 12px 40px rgba(15, 23, 42, 0.2);
  overflow: hidden;
}

.perfil-productivo-modal__h h2 {
  margin: 0 0 6px;
  font-size: 17px;
  font-weight: 900;
  color: var(--texto-fuerte, #0f172a);
  font-family: 'Segoe UI', Tahoma, Arial, sans-serif;
}

.perfil-productivo-modal__sub {
  margin: 0 0 14px;
  font-size: 13px;
  font-weight: 600;
  color: var(--texto-suave, #64748b);
  line-height: 1.4;
}

.perfil-productivo-modal__opts {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.perfil-productivo-opt {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 52px;
  padding: 12px 14px;
  border-radius: 12px;
  border: 1px solid var(--gris-300, #cbd5e1);
  background: linear-gradient(180deg, #fff 0%, #f8fafc 100%);
  color: var(--texto-fuerte, #0f172a);
  font-size: 14px;
  font-weight: 800;
  cursor: pointer;
  font-family: 'Segoe UI', Tahoma, Arial, sans-serif;
  text-align: left;
  box-shadow: var(--manto-serio-panel-drop, 0 1px 2px rgba(15, 23, 42, 0.06));
}

.perfil-productivo-opt:hover {
  border-color: var(--gris-400, #94a3b8);
  background: var(--gris-100, #f1f5f9);
}

.perfil-productivo-opt__ico {
  font-size: 22px;
  line-height: 1;
  flex-shrink: 0;
}

.perfil-productivo-opt__lbl {
  flex: 1;
}

/* Demo leche — header + nav con fon1.png (prioridad sobre tema Apariencia / hea1) */
html body.manto-demo-vitrina-leche.hdr-fondo-fon1 .nav.nav--rail-cards,
html body.manto-demo-vitrina-leche.hdr-fondo-hea1 .nav.nav--rail-cards,
html body.manto-demo-vitrina-leche .nav.nav--rail-cards,
html body[data-perfil='leche'][data-demo-vitrina='1'] .nav.nav--rail-cards {
  background: url('../icons/fon1.png?v=20260521fon1') center center / cover no-repeat !important;
}

html body.manto-demo-vitrina-leche.hdr-fondo-fon1 #app .hdr.hdr-serio-v1,
html body.manto-demo-vitrina-leche.hdr-fondo-hea1 #app .hdr.hdr-serio-v1,
html body.manto-demo-vitrina-leche #app .hdr.hdr-serio-v1,
html body[data-perfil='leche'][data-demo-vitrina='1'] #app .hdr.hdr-serio-v1 {
  background:
    linear-gradient(rgba(0, 0, 0, 0.38), rgba(0, 0, 0, 0.38)),
    url('../icons/fon1.png?v=20260521fon1') center center / cover no-repeat !important;
}

/* Ganadería de carne (demo + perfil carne) — header + nav con hea2.png */
html body.manto-demo-vitrina-carne.hdr-fondo-hea2 .nav.nav--rail-cards,
html body.manto-demo-vitrina-carne.hdr-fondo-hea1 .nav.nav--rail-cards,
html body.manto-demo-vitrina-carne .nav.nav--rail-cards,
html body.manto-piel-carne .nav.nav--rail-cards,
html body.manto-perfil-carne .nav.nav--rail-cards,
html body[data-perfil='carne'] .nav.nav--rail-cards,
html body[data-producto='carne'] .nav.nav--rail-cards,
html body.hdr-fondo-hea2[data-producto='carne'] .nav.nav--rail-cards {
  background: url('../icons/hea2.png?v=20260521hea2') center center / cover no-repeat !important;
  background-image: url('../icons/hea2.png?v=20260521hea2') !important;
}

html body.manto-demo-vitrina-carne.hdr-fondo-hea2 #app .hdr.hdr-serio-v1,
html body.manto-demo-vitrina-carne.hdr-fondo-hea1 #app .hdr.hdr-serio-v1,
html body.manto-demo-vitrina-carne #app .hdr.hdr-serio-v1,
html body.manto-piel-carne #app .hdr.hdr-serio-v1,
html body.manto-perfil-carne #app .hdr.hdr-serio-v1,
html body[data-perfil='carne'] #app .hdr.hdr-serio-v1,
html body[data-producto='carne'] #app .hdr.hdr-serio-v1,
html body.hdr-fondo-hea2[data-producto='carne'] #app .hdr.hdr-serio-v1 {
  background:
    linear-gradient(rgba(0, 0, 0, 0.38), rgba(0, 0, 0, 0.38)),
    url('../icons/hea2.png?v=20260521hea2') center center / cover no-repeat !important;
}

/* Móvil: anula gradiente slate del rail cuando el producto es carne */
@media (max-width: 767px) {
  html body.manto-perfil-carne .nav.nav--rail-cards,
  html body.manto-piel-carne .nav.nav--rail-cards,
  html body[data-producto='carne'] .nav.nav--rail-cards,
  html body.hdr-fondo-hea2 .nav.nav--rail-cards {
    background: url('../icons/hea2.png?v=20260521hea2') center center / cover no-repeat !important;
    background-image: url('../icons/hea2.png?v=20260521hea2') !important;
  }
  html body.manto-perfil-carne #app .hdr.hdr-serio-v1,
  html body[data-producto='carne'] #app .hdr.hdr-serio-v1,
  html body.hdr-fondo-hea2 #app .hdr.hdr-serio-v1 {
    background:
      linear-gradient(rgba(0, 0, 0, 0.38), rgba(0, 0, 0, 0.38)),
      url('../icons/hea2.png?v=20260521hea2') center center / cover no-repeat !important;
  }
}

/* Leche: reafirma fon1 sobre rail móvil */
@media (max-width: 767px) {
  html body.manto-perfil-leche.hdr-fondo-fon1 .nav.nav--rail-cards,
  html body.manto-demo-vitrina-leche .nav.nav--rail-cards,
  html body[data-producto='leche'].hdr-fondo-fon1 .nav.nav--rail-cards {
    background: url('../icons/fon1.png?v=20260521fon1') center center / cover no-repeat !important;
    background-image: url('../icons/fon1.png?v=20260521fon1') !important;
  }
}
