/**
 * Mapa corporal para filtrar la biblioteca de ejercicios.
 *
 * Se conservan las clases originales de los SVG (.muscle, .joint-hit, .body-base…):
 * solo se acotan bajo .tmp-bodymap para no pisar el tema, y la paleta pasa a los
 * colores de marca vía variables.
 */

.tmp-bodymap{
	--ink:#1f2937;
	--muted:#728094;
	--line:rgba(114,128,148,.16);
	--body:#e8edf1;
	--body-stroke:#62707f;
	--muscle:#cbd4db;
	--muscle-stroke:#ffffff;
	--joint:#cbd4db;
	--joint-stroke:#ffffff;
	--joint-dark:#c400ba;
	--joint-ring:rgba(255,0,243,.22);
	--label:#ffffff;
	--label-stroke:#d6dee6;
	/* Marca */
	--hover:#ff7df1;
	--active:var(--tmp-primary,#FF00F3);
	--active-dark:#c400ba;
	--active-ring:rgba(255,0,243,.28);
	color:var(--ink);
}

.tmp-bodymap .body-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
.tmp-bodymap .body-panel{position:relative;
  padding:24px 12px 28px;
  min-width:0;
  background:
    radial-gradient(circle at 50% 10%, rgba(239,64,90,.05), transparent 32%),
    linear-gradient(180deg, rgba(255,255,255,.62), rgba(255,255,255,.18));}
.tmp-bodymap .body-panel + .body-panel{border-left:1px solid var(--line)}
.tmp-bodymap .view-title{text-align:center;
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.18em;
  color:var(--muted);
  margin:0 0 8px;}
.tmp-bodymap .figure-wrap{position:relative;width:min(100%,560px);margin:0 auto}
.tmp-bodymap .figure-wrap::before{content:"";
  position:absolute;
  inset:84px 58px 32px;
  border-radius:999px;
  background:radial-gradient(circle at 50% 28%, rgba(98,112,127,.10), rgba(98,112,127,0) 58%);
  filter:blur(14px);
  pointer-events:none;}
.tmp-bodymap .body-svg{display:block;width:100%;height:auto;overflow:visible}
.tmp-bodymap .body-base{fill:var(--body);stroke:var(--body-stroke);stroke-width:2.15;stroke-linecap:round;stroke-linejoin:round}
.tmp-bodymap .body-detail{fill:none;stroke:#9eabb8;stroke-width:1.45;stroke-linecap:round;opacity:.85;pointer-events:none}
.tmp-bodymap .muscle{fill:var(--muscle);
  stroke:var(--muscle-stroke);
  stroke-width:2.15;
  stroke-linejoin:round;
  cursor:pointer;
  transition:fill .16s ease, filter .16s ease, transform .16s ease;
  transform-box:fill-box;
  transform-origin:center;
  outline:none;}
.tmp-bodymap .muscle:hover,
.tmp-bodymap .muscle:focus-visible{fill:var(--hover);
  transform:translateY(-1px) scale(1.014);
  filter:drop-shadow(0 5px 10px rgba(239,64,90,.16));}
.tmp-bodymap .muscle.active{fill:var(--active);filter:drop-shadow(0 7px 10px rgba(239,64,90,.24))}
.tmp-bodymap .muscle.active:hover{fill:var(--active-dark)}
.tmp-bodymap .connector{fill:none;stroke:#aeb9c4;stroke-width:1.5;stroke-linecap:round;stroke-dasharray:2 5;pointer-events:none}
.tmp-bodymap .pin{fill:#c7d1da;stroke:#ffffff;stroke-width:2;pointer-events:none}
.tmp-bodymap .muscle-label{cursor:pointer;outline:none}
.tmp-bodymap .muscle-label rect{fill:var(--label);
  stroke:var(--label-stroke);
  stroke-width:1.2;
  filter:drop-shadow(0 8px 14px rgba(31,41,55,.08));
  transition:fill .16s ease, stroke .16s ease, transform .16s ease;}
.tmp-bodymap .muscle-label text{font-size:11px;
  font-weight:800;
  fill:#405162;
  text-anchor:middle;
  dominant-baseline:middle;
  letter-spacing:.01em;
  pointer-events:none;}
.tmp-bodymap .muscle-label:hover rect,
.tmp-bodymap .muscle-label:focus-visible rect{fill:#fff2f5;stroke:#ffc0cb;transform:translateY(-1px)}
.tmp-bodymap .muscle-label.active rect{fill:var(--active);stroke:var(--active-dark)}
.tmp-bodymap .muscle-label.active text{fill:#ffffff}
.tmp-bodymap .joint-hit{cursor:pointer;outline:none}
.tmp-bodymap .joint-ring{fill:var(--joint-ring);
  transition:fill .16s ease, transform .16s ease;
  transform-box:fill-box;
  transform-origin:center;
  pointer-events:none;}
.tmp-bodymap .joint-core{fill:var(--joint);
  stroke:var(--joint-dark);
  stroke-width:2.3;
  transition:fill .16s ease, stroke .16s ease, transform .16s ease;
  transform-box:fill-box;
  transform-origin:center;
  pointer-events:none;}
.tmp-bodymap .joint-hit:hover .joint-ring,
.tmp-bodymap .joint-hit:focus-visible .joint-ring{fill:rgba(255,140,160,.36);transform:scale(1.18)}
.tmp-bodymap .joint-hit:hover .joint-core,
.tmp-bodymap .joint-hit:focus-visible .joint-core{transform:scale(1.08)}
.tmp-bodymap .joint-hit.active .joint-ring{fill:var(--active-ring);transform:scale(1.22)}
.tmp-bodymap .joint-hit.active .joint-core{fill:var(--active);stroke:var(--active-dark);transform:scale(1.1)}
.tmp-bodymap .joint-label{cursor:pointer;outline:none}
.tmp-bodymap .joint-label rect{fill:var(--label);
  stroke:var(--label-stroke);
  stroke-width:1.2;
  filter:drop-shadow(0 8px 14px rgba(31,41,55,.08));
  transition:fill .16s ease, stroke .16s ease, transform .16s ease;}
.tmp-bodymap .joint-label text{font-size:11px;
  font-weight:800;
  fill:#405162;
  text-anchor:middle;
  dominant-baseline:middle;
  letter-spacing:.01em;
  pointer-events:none;}
.tmp-bodymap .joint-label:hover rect,
.tmp-bodymap .joint-label:focus-visible rect{fill:#fff2f5;stroke:#ffc0cb;transform:translateY(-1px)}
.tmp-bodymap .joint-label.active rect{fill:var(--active);stroke:var(--active-dark)}
.tmp-bodymap .joint-label.active text{fill:#ffffff}

/* Marca en los estados de selección (pisa los rojos del diseño original). */
.tmp-bodymap .muscle.active{fill:var(--active);filter:drop-shadow(0 7px 10px rgba(255,0,243,.24));}
.tmp-bodymap .muscle.active:hover{fill:var(--active-dark);}
.tmp-bodymap .muscle:hover,
.tmp-bodymap .muscle:focus-visible{fill:var(--hover);}
.tmp-bodymap .muscle-label:hover rect,
.tmp-bodymap .muscle-label:focus-visible rect,
.tmp-bodymap .joint-label:hover rect,
.tmp-bodymap .joint-label:focus-visible rect{fill:#fff0fe;stroke:var(--hover);}
.tmp-bodymap .muscle-label.active rect,
.tmp-bodymap .joint-label.active rect{fill:var(--active);stroke:var(--active-dark);}
.tmp-bodymap .muscle-label.active text,
.tmp-bodymap .joint-label.active text{fill:#fff;}

/* En celular, una vista debajo de la otra (si no, las figuras quedan diminutas). */
@media (max-width:720px){
	.tmp-bodymap .body-grid{grid-template-columns:1fr;}
}