/* DSA CRM v11.44 — planning 10 h–19 h, équipe lisible et rendez-vous en cours. */

/* Une seule métrique sur tous les appareils : 60 px par heure, neuf heures
   entièrement visibles, puis libre défilement vers le reste des 24 heures. */
#v-calendar .v9-gcal-scroll,
#v-todo .v9-gcal-scroll{
  height:558px!important;
  min-height:558px!important;
  max-height:558px!important;
  overflow-x:auto!important;
  overflow-y:auto!important;
  scroll-behavior:auto!important;
  scrollbar-gutter:stable!important;
  overscroll-behavior:contain!important;
}
#v-calendar .v9-gcal-hours,
#v-calendar .v9-gcal-days,
#v-todo .v9-gcal-hours,
#v-todo .v9-gcal-days{
  height:1440px!important;
  min-height:1440px!important;
}
#v-calendar .v9-gcal-day,
#v-todo .v9-gcal-day{
  background:repeating-linear-gradient(to bottom,
    transparent 0,transparent 29px,
    rgba(60,64,67,.055) 29px,rgba(60,64,67,.055) 30px,
    transparent 30px,transparent 59px,
    rgba(60,64,67,.16) 59px,rgba(60,64,67,.16) 60px)!important;
}
#v-calendar .v9-gcal-day.today,
#v-todo .v9-gcal-day.today{
  background:linear-gradient(rgba(139,26,47,.032),rgba(139,26,47,.032)),repeating-linear-gradient(to bottom,
    transparent 0,transparent 29px,
    rgba(60,64,67,.055) 29px,rgba(60,64,67,.055) 30px,
    transparent 30px,transparent 59px,
    rgba(60,64,67,.16) 59px,rgba(60,64,67,.16) 60px)!important;
}
#v-calendar .v9-gcal-hours span,
#v-todo .v9-gcal-hours span{
  font-size:12px!important;
  font-weight:650!important;
  line-height:1!important;
}

/* La légende est un vrai bandeau indépendant : aucun nom ne passe derrière
   l'en-tête des jours, même sur une tablette ou un téléphone. */
#v-calendar .v9-calendar-legend{
  position:relative!important;
  z-index:8!important;
  display:flex!important;
  flex:0 0 auto!important;
  align-items:center!important;
  gap:8px!important;
  min-height:42px!important;
  margin:0!important;
  padding:7px 16px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  border-top:1px solid #ebe7e8!important;
  border-bottom:1px solid #e4dfe1!important;
  background:#fbfafb!important;
  white-space:nowrap!important;
  scrollbar-width:thin!important;
}
#v-calendar .v9-calendar-legend span{
  display:inline-flex!important;
  flex:0 0 auto!important;
  align-items:center!important;
  gap:7px!important;
  min-height:27px!important;
  padding:3px 9px!important;
  border:1px solid #e6e1e3!important;
  border-radius:999px!important;
  background:#fff!important;
  color:#4f4f54!important;
  font-size:11.5px!important;
  font-weight:650!important;
  line-height:19px!important;
}
#v-calendar .v9-calendar-legend i{
  width:9px!important;
  height:9px!important;
  flex:0 0 9px!important;
  border-radius:50%!important;
  box-shadow:0 0 0 2px #fff,0 0 0 3px currentColor!important;
}

/* Le rendez-vous reprend sans ambiguïté la couleur enregistrée pour le
   commercial responsable. */
#v-calendar .v9-gcal-event,
#v-todo .v9-gcal-event{
  min-height:38px!important;
  border-left:4px solid var(--agent-color,#8b1a2f)!important;
  background:color-mix(in srgb,var(--agent-color,#8b1a2f) 17%,#fff)!important;
}

/* État temporel de la To Do. */
.v107-action-row.appointment.v1144-ongoing{
  border-left:3px solid #1f7a46!important;
  background:linear-gradient(90deg,rgba(31,122,70,.055),#fff 32%)!important;
}
.v1144-rdv-state{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:max-content!important;
  margin-top:5px!important;
  padding:3px 7px!important;
  border-radius:999px!important;
  background:#eaf6ef!important;
  color:#176b3c!important;
  font-size:9.5px!important;
  font-style:normal!important;
  font-weight:800!important;
  letter-spacing:.04em!important;
  text-transform:uppercase!important;
}

@media(max-width:760px){
  #v-calendar .v9-gcal-scroll,
  #v-todo .v9-gcal-scroll{
    height:558px!important;
    min-height:558px!important;
    max-height:558px!important;
  }
  #v-calendar .v9-calendar-legend{min-height:44px!important;padding:8px 12px!important}
  #v-calendar .v9-calendar-legend span{font-size:11px!important}
}