/* ====== Layout base ====== */
:root{
  --m201-bg:#f5f7fb;
  --m201-card:#ffffff;
  --m201-text:#0f172a;
  --m201-muted:#64748b;
  --m201-primary:#1e40af;
  --m201-primary-600:#1d4ed8;
  --m201-primary-700:#1e3a8a;
  --m201-success:#16a34a;
  --m201-danger:#b91c1c;
  --m201-border:#e5e7eb;
  --m201-shadow:0 6px 18px rgba(2,6,23,.06);
  --m201-radius:14px;
}

html,body{ height:100%; background:var(--m201-bg); color:var(--m201-text); }

/* ====== Page blocks ====== */
.container{
  max-width: 1160px;
  padding: 24px 20px 48px;
}

.title{
  font-weight: 800;
  font-size: 28px;
  margin: 8px 0 18px;
  letter-spacing: 0.2px;
}

.panel{
  background: var(--m201-card);
  border: 1px solid var(--m201-border);
  box-shadow: var(--m201-shadow);
  border-radius: var(--m201-radius);
  padding: 16px;
  margin-bottom: 16px;
}

.row{
  display:flex; gap:12px; flex-wrap:wrap; align-items:flex-end;
}

.input, select.input, textarea.input{
  width:100%;
  border:1px solid var(--m201-border);
  border-radius:10px;
  padding:10px 12px;
  font-size:14px;
  background:#fff;
}

/* ====== Buttons ====== */
.btn{
  display:inline-flex; align-items:center; gap:6px;
  padding:9px 14px; border-radius:10px; border:1px solid var(--m201-border);
  background:#fff; color:var(--m201-text); text-decoration:none; cursor:pointer;
  transition:.15s ease;
}
.btn:hover{ transform:translateY(-1px); box-shadow: var(--m201-shadow); }
.btn.primary{ background:var(--m201-primary); color:#fff; border-color:transparent; }
.btn.primary:hover{ background:var(--m201-primary-600); }
.btn.btn-danger{ background:var(--m201-danger); color:#fff; border-color:transparent; }
.toolbar{ display:flex; gap:10px; margin-top:14px; }

/* ====== Calendar wrapper ====== */
.calendar{
  background: var(--m201-card);
  border: 1px solid var(--m201-border);
  box-shadow: var(--m201-shadow);
  border-radius: var(--m201-radius);
  padding: 10px 12px 18px;
}

/* ====== FullCalendar header ====== */
.fc .fc-toolbar{
  background: var(--m201-primary);
  color:#fff; border-radius:12px;
  padding:10px 12px; margin:0 0 12px;
}
.fc .fc-toolbar-title{ font-weight:800; letter-spacing:.3px; }
.fc .fc-button{
  background: rgba(255,255,255,.12); border:0; color:#fff; text-transform:none;
  border-radius:10px; padding:6px 10px;
}
.fc .fc-button-primary:not(:disabled).fc-button-active,
.fc .fc-button-primary:not(:disabled):active{ background:#111827; }
.fc .fc-button:hover{ background: rgba(255,255,255,.22); }
.fc .fc-today-button{ background:#111827; }

/* ====== Day cells ====== */
.fc .fc-daygrid-day { padding:6px; }
.fc .fc-scrollgrid, .fc .fc-scrollgrid-section{ border-color: var(--m201-border); }

/* ====== Event as CARD ====== */
.m201-card{
  display:flex; gap:10px; align-items:flex-start;
  position: relative;
  width: 100%;
  background:#fff;
  border:1px solid var(--m201-border);
  border-radius:14px;
  box-shadow: var(--m201-shadow);
  padding:10px 12px;
  margin:2px 0;
  padding-left: 12px;
  border-left: 6px solid transparent;
}

.m201-card__chk{
  width:18px; height:18px; margin-top:3px; cursor:pointer;
}
.m201-card__body{ display:flex; flex-direction:column; gap:4px; min-width:0; }

.m201-card__title{
  font-weight:700;
  font-size:14px;
  line-height:1.25;
  display:block !important;          /* antes: -webkit-box */
  -webkit-line-clamp: unset !important;  /* antes: 2 */
  -webkit-box-orient: vertical;      /* inofensivo dejarlo */
  overflow:visible !important;       /* antes: hidden */
  white-space:normal !important;
  word-break:break-word;
}


.m201-card__meta{ font-size:12px; color:#475569; }

.m201-card__icon{
  width:18px; height:18px;
  display:inline-flex; align-items:center; justify-content:center;
  font-size:14px; color: var(--m201-muted);
}

.estado-pendiente { border-left-color: var(--m201-primary); }
.estado-hecho     { border-left-color: var(--m201-success); }
.estado-cancelado { border-left-color: var(--m201-danger);  opacity:.80; }

.fc .done .m201-card{ opacity:.85; }
.fc .done .m201-card__title{ text-decoration: line-through; color: var(--m201-muted); }

.fc .fc-daygrid-event {
  display:block !important;
  width:100% !important;
  margin:0 0 6px 0 !important;
  white-space:normal !important;
  border:0 !important;
}

/* ====== Modal ====== */
.m201-modal{
  position:fixed; inset:0; background:rgba(15,23,42,.45);
  display:flex; align-items:center; justify-content:center; padding:22px; z-index:1000;
}
.m201-modal.hidden{ display:none; }
.m201-modal__dialog{
  width:min(920px, 96vw); background:#fff; border-radius:16px; overflow:hidden;
  box-shadow:0 24px 60px rgba(2,6,23,.22);
}
.m201-modal__header{
  background: var(--m201-primary);
  color:#fff; padding:16px 18px; display:flex; align-items:center; justify-content:space-between;
}
.m201-modal__close{
  background: transparent; border:0; color:#fff; font-size:24px; line-height:1; cursor:pointer;
}
.m201-modal__body{ padding:16px; }
.m201-modal__footer{ padding:14px 16px; border-top:1px solid var(--m201-border); text-align:right; }
.m201-grid{
  display:grid; gap:12px; grid-template-columns: repeat(2, minmax(0, 1fr));
}
.m201-col-span{ grid-column: 1 / -1; }
.m201-field label{ display:block; font-size:12px; color:var(--m201-muted); margin-bottom:6px; }

@media (max-width: 720px){
  .m201-grid{ grid-template-columns: 1fr; }
  .fc .fc-toolbar { border-radius:10px; }
}

/* ====== Utility tweaks ====== */
.badge{
  font-weight:600; border:1px solid var(--m201-border);
}

input[type="checkbox"]{ transform: translateY(1px); }

/* ===== MAIN201: Calendario más grande (overrides) ===== */
.container{
  max-width: 1600px;
  padding: 28px 32px 56px;
}
@media (min-width: 1800px){
  .container{ max-width: 1720px; }
}

.calendar{ width:100%; font-size: 1.06rem; }

.fc .fc-toolbar{
  padding: 14px 16px;
}
.fc .fc-toolbar-title{
  font-size: 1.6rem;
  letter-spacing: .2px;
}
.fc .fc-button{
  padding: 8px 12px;
}

.fc .fc-daygrid-day{
  padding: 12px;
}
.fc .fc-daygrid-day-number{
  font-size: 1.1rem;
}

.m201-card{ padding: 12px 14px; }
.m201-card__title{ font-size: 15px; }
.m201-card__meta{ font-size: 13px; }

@media (max-width: 720px){
  .container{ max-width: 100%; padding: 18px 14px 36px; }
  .fc .fc-toolbar-title{ font-size: 1.25rem; }
  .fc .fc-button{ padding: 6px 10px; }
  .fc .fc-daygrid-day{ padding: 8px; }
  .m201-card{ padding: 10px 12px; }
  .m201-card__title{ font-size: 14px; }
  .m201-card__meta{ font-size: 12px; }
}

/* Reducir tamaño de texto en los eventos */
.fc-event-title {
  font-size: 0.80rem; /* antes aprox. 1rem */
}

.fc-event-time {
  font-size: 0.75rem; /* más pequeño aún para las horas */
}

/* Ajuste fino de tamaño en tarjetas de evento */
.m201-card__title { font-size: 12px !important; }  /* título de la tarea */
.m201-card__meta  { font-size: 11px !important; }  /* hora debajo del título */