/* eventi in modal: sempre cliccabili */
#crm-cal-modal * { pointer-events: auto; }

#crm-cal-events { 
  position: relative; 
  z-index: 999999; 
}

#crm-cal-events .crm-cal-event {
  position: relative;
  z-index: 999999;
  cursor: pointer;
  pointer-events: auto;
}
/* =========================
   CRM CALENDAR – MINI (PHONE SIZE)
   ========================= */

.crm-calendar-box{
  width: 100%;
  max-width: 360px;          /* fisso stile telefono */
  margin: 10px auto;
  padding: 10px;
  border: 1px solid #eee;
  border-radius: 14px;
  background: #fff;

  max-height: 72vh;          /* non diventa infinita */
  overflow: auto;            /* scroll interno */
}

.crm-calendar-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;

  position: sticky;          /* resta visibile nello scroll interno */
  top: 0;
  background:#fff;
  padding: 6px 0;
  z-index: 5;
}

.crm-calendar-grid{
  display:grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 5px;
}

.crm-day{
  min-height: 38px;
  border: 1px solid #ddd;
  border-radius: 10px;
  padding: 4px;
  font-size: 12px;
  position: relative;
}

.crm-day > span{
  font-size: 12px;
  font-weight: 600;
}

@media (max-width: 380px){
  .crm-calendar-box{
    max-width: 100%;
    max-height: 68vh;
  }
  .crm-calendar-grid{ gap: 4px; }
  .crm-day{ min-height: 36px; padding: 4px; }
}
/* OVERRIDE inline JS (solo mobile) */
@media (max-width: 480px){
  .crm-calendar-grid{
    grid-template-columns: repeat(7, 1fr) !important;
    gap: 4px !important;
  }
  .crm-day{
    min-height: 34px !important;
    padding: 3px !important;
    font-size: 11px !important;
    border-radius: 10px !important;
  }
}
.crm-day{
  position:relative;
}

.crm-day-empty{
  opacity:.25;
}

.crm-day-badge{
  position:absolute;
  top:6px;
  right:6px;
  font-size:11px;
  padding:1px 6px;
  border-radius:999px;
  border:1px solid #ddd;
  background:#fff;
}
