@import url('https://fonts.googleapis.com/css2?family=Almarai:wght@400;700;800&display=swap');

:root{
  --player-size:54px;
  --player-font:12px;
}

.alahly-formation-wrapper{
  display:flex;
  flex-direction:row;
  gap:12px;
  align-items:stretch;
  font-family:'Almarai',sans-serif;
}

.slider-panel{
  width:45%;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  background:#f4f4f4;
  border-radius:10px;
  padding:0;
  position:relative;
}

.slider-panel .slide{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:flex-end; /* المحتوى في أسفل الصورة */
  width:100%;
  height:100%;
  position:relative;
}

.slider-panel .slide img{
  width:100%;
  height:100%;
  object-fit:cover;
  border-radius:10px;
  box-shadow:0 6px 16px rgba(0,0,0,0.25);
}

.slider-panel .info{
  position:absolute;
  bottom:12px; /* مسافة من أسفل الصورة */
  left:50%;
  transform:translateX(-50%);
  font-weight:700;
  font-size:16px;
  color:#fff;
  text-shadow:1px 1px 6px rgba(0,0,0,0.8);
  background:rgba(0,0,0,0.4); /* خلفية شفافة */
  padding:6px 12px;
  border-radius:8px;
  white-space:nowrap;
}

.pitch-panel{
  width:55%;
  position:relative;
  border-radius:10px;
  overflow:hidden;
  border:2px solid rgba(255,255,255,0.9);
  background-size:cover;
  background-position:center;
}

.pitch-panel.front{height:700px}
.pitch-panel.admin{height:700px} /* admin vertical */

.center-circle{
  width:64px;
  height:64px;
  border-radius:50%;
  border:3px solid rgba(255,255,255,0.9);
  position:absolute;
  top:50%;
  left:50%;
  transform:translate(-50%,-50%);
}

.penalty-area{
  position:absolute;
  background:rgba(255,255,255,0.06);
  border-radius:6px;
}

.penalty-left{left:0;top:30%;width:30%;height:16%}
.penalty-right{right:0;top:30%;width:30%;height:16%}

.pitch-player{
  position:absolute;
  transform:translate(-50%,-50%) scale(1);
  transition:transform .35s ease,box-shadow .25s ease,opacity .3s;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:6px;
  cursor:pointer;
  z-index:40;
}

.pitch-player .pp-img{
  width:var(--player-size);
  height:var(--player-size);
  border-radius:50%;
  object-fit:cover;
  border:2px solid rgba(255,255,255,0.7);
  box-shadow:0 6px 12px rgba(0,0,0,0.45);
}

.pitch-player .pp-name{
  color:#fff;
  font-weight:800;
  font-size:var(--player-font);
  text-shadow:1px 1px 6px rgba(0,0,0,0.8);
  white-space:nowrap;
}

.pitch-player.active{
  transform:translate(-50%,-50%) scale(1.35);
  z-index:90;
  box-shadow:0 10px 30px rgba(0,0,0,0.6);
}

.pitch-player.hidden{opacity:0}

#alahly-players-table input.player-x,#alahly-players-table input.player-y{width:90px}
#admin-pitch-area{min-height:260px;margin-top:12px;position:relative}
.af-dragging{cursor:grabbing !important}

@media(max-width:768px){
  .alahly-formation-wrapper{flex-direction:column}
  .slider-panel,.pitch-panel{width:100%;height:420px}
  .slider-panel .slide img{width:140px}
}