/* ===== OLYMPIA MOVEMENTS CALENDAR V1 =====
   Vista calendario mensual para la pestaña Movimientos.
   Tipografía Inter (cargada desde index.html) con peso ligero, igual de
   legible que el calendario principal.
*/

.moves-calendar-v1{
  font-family:"Inter","Segoe UI Variable","Segoe UI",system-ui,-apple-system,"Roboto","Helvetica Neue",Arial,sans-serif;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  font-synthesis:none;
  display:flex;
  flex-direction:column;
  gap:10px;
  height:calc(100vh - 92px);
  min-height:0;
  overflow:hidden;
  padding:8px 4px 0;
}

.moves-topbar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
  padding:6px 12px;
  background:rgba(23,23,36,.92);
  border:1px solid rgba(255,255,255,.06);
  border-radius:14px;
}

.moves-topbar h2{
  margin:0;
  font-size:1rem;
  font-weight:500;
  letter-spacing:.02em;
  color:rgba(255,255,255,.92);
}

.moves-topbar p{
  margin:2px 0 0;
  font-size:.72rem;
  font-weight:300;
  letter-spacing:.02em;
  color:rgba(255,255,255,.65);
}

.moves-topbar p b{
  font-weight:500;
  color:rgba(255,255,255,.88);
}

.moves-actions{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:wrap;
}

.moves-actions .btn{
  height:28px;
  min-height:28px;
  padding:0 10px;
  font-size:.74rem;
  font-weight:400;
  letter-spacing:.02em;
}

.moves-mini-select{
  height:28px;
  min-height:28px;
  padding:2px 8px;
  border-radius:8px;
  font-size:.74rem;
  font-weight:400;
  background:rgba(7,7,12,.9);
  color:rgba(255,255,255,.9);
  border:1px solid rgba(255,255,255,.1);
  letter-spacing:.02em;
}

.moves-legend{
  display:flex;
  flex-wrap:wrap;
  gap:10px 14px;
  padding:6px 12px;
  background:rgba(23,23,36,.6);
  border:1px solid rgba(255,255,255,.05);
  border-radius:12px;
}

.moves-legend-item{
  display:inline-flex;
  align-items:center;
  gap:6px;
  font-size:.7rem;
  font-weight:300;
  letter-spacing:.025em;
  color:rgba(255,255,255,.78);
}

.moves-legend-item i{
  display:inline-block;
  width:11px;
  height:11px;
  border-radius:3px;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.18);
}

.moves-weekdays{
  display:grid;
  grid-template-columns:repeat(7, 1fr);
  gap:4px;
  padding:0 2px;
}

.moves-weekdays div{
  text-align:center;
  font-size:.7rem;
  font-weight:400;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:rgba(255,255,255,.6);
  padding:4px 0;
}

.moves-grid{
  display:grid;
  grid-template-columns:repeat(7, 1fr);
  grid-auto-rows:1fr;
  gap:4px;
  flex:1;
  min-height:0;
  padding:0 2px 8px;
}

.moves-day{
  background:rgba(23,23,36,.85);
  border:1px solid rgba(255,255,255,.05);
  border-radius:10px;
  padding:4px;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  gap:2px;
  min-height:0;
}

.moves-day-outside{
  background:rgba(15,15,22,.5);
  opacity:.45;
}

.moves-day-today{
  border-color:rgba(226,47,68,.55);
  box-shadow:inset 0 0 0 1px rgba(226,47,68,.25);
}

.moves-day-number{
  font-size:.78rem;
  font-weight:400;
  letter-spacing:.02em;
  color:rgba(255,255,255,.78);
  margin-bottom:2px;
  padding:0 2px;
}

.moves-day-today .moves-day-number{
  color:rgba(255,255,255,.95);
  font-weight:500;
}

.moves-event{
  display:grid;
  grid-template-columns:38px minmax(0,1fr);
  align-items:center;
  gap:4px;
  text-align:left;
  width:100%;
  border:0;
  border-radius:6px;
  padding:2px 6px;
  cursor:pointer;
  color:rgba(255,255,255,.92);
  min-height:18px;
  font-family:inherit;
}

.moves-event b{
  font-size:.7rem;
  font-weight:400;
  line-height:1.2;
  letter-spacing:.03em;
  font-feature-settings:"tnum" 1;
}

.moves-event span{
  font-size:.72rem;
  font-weight:300;
  line-height:1.2;
  letter-spacing:.03em;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.moves-event:hover{
  filter:brightness(1.12);
  transform:translateY(-1px);
}

.moves-more{
  border:0;
  width:100%;
  text-align:left;
  cursor:pointer;
  padding:1px 6px;
  border-radius:6px;
  font-size:.68rem;
  font-weight:400;
  letter-spacing:.025em;
  color:rgba(255,255,255,.85);
  background:rgba(226,47,68,.28);
  font-family:inherit;
}

.moves-more:hover{
  background:rgba(226,47,68,.42);
}

/* Modal de detalle de un movimiento */
.moves-detail-modal{
  max-width:520px;
}

.moves-detail-head{
  padding:12px 16px;
  background:rgba(23,23,36,.92);
  border-radius:12px;
  margin-bottom:14px;
}

.moves-detail-head h2{
  margin:0;
  font-size:1rem;
  font-weight:500;
  letter-spacing:.02em;
  color:rgba(255,255,255,.95);
}

.moves-detail-head p{
  margin:4px 0 0;
  font-weight:300;
  letter-spacing:.02em;
  color:rgba(255,255,255,.7);
}

.moves-detail-body p{
  margin:6px 0;
  font-size:.85rem;
  font-weight:300;
  letter-spacing:.015em;
  color:rgba(255,255,255,.88);
  line-height:1.5;
}

.moves-detail-body p b{
  font-weight:500;
  color:rgba(255,255,255,.95);
}

/* Modal con el listado completo del día (al pulsar "+N más") */
.moves-day-modal{
  max-width:560px;
}

.moves-day-list{
  display:flex;
  flex-direction:column;
  gap:6px;
  max-height:60vh;
  overflow:auto;
  margin:10px 0;
}

.moves-day-row{
  display:grid;
  grid-template-columns:1fr;
  gap:2px;
  text-align:left;
  width:100%;
  border:0;
  background:rgba(255,255,255,.04);
  padding:8px 12px;
  border-radius:10px;
  cursor:pointer;
  color:rgba(255,255,255,.9);
  font-family:inherit;
}

.moves-day-row b{
  font-size:.78rem;
  font-weight:500;
  letter-spacing:.02em;
}

.moves-day-row span{
  font-size:.78rem;
  font-weight:300;
  letter-spacing:.02em;
  color:rgba(255,255,255,.78);
}

.moves-day-row small{
  font-size:.7rem;
  font-weight:300;
  letter-spacing:.02em;
  color:rgba(255,255,255,.6);
}

.moves-day-row:hover{
  background:rgba(255,255,255,.075);
}
