/* DSA CRM v11.27 — Planning au rendu Google Calendar et fiche de rendez-vous éditable. */

/* ── Fenêtre de travail : neuf heures pleines, 10 h → 19 h ─────────────────── */
#v-calendar .v9-gcal-scroll,
#v-todo .v9-gcal-scroll{
  height:576px!important;      /* 9 h × 64 px */
  min-height:576px!important;
  max-height:576px!important;
  overflow-y:auto!important;
  scroll-behavior:auto!important;
  border-top:1px solid #e4e2e3!important;
}

/* ── Colonne des heures ────────────────────────────────────────────────────── */
#v-calendar .v9-gcal-hours,
#v-todo .v9-gcal-hours{
  background:#fff!important;
  border-right:1px solid #e4e2e3!important;
  width:58px!important;
}
#v-calendar .v9-gcal-hours span,
#v-todo .v9-gcal-hours span{
  right:9px!important;
  font-size:10px!important;
  font-weight:500!important;
  color:#70757a!important;
  letter-spacing:.01em!important;
  transform:translateY(-6px)!important;
}

/* ── Grille : trait plein à l'heure, trait léger à la demi-heure ───────────── */
#v-calendar .v9-gcal-day,
#v-todo .v9-gcal-day{
  background:repeating-linear-gradient(to bottom,
    transparent 0, transparent 31px,
    rgba(60,64,67,.06) 31px, rgba(60,64,67,.06) 32px,
    transparent 32px, transparent 63px,
    rgba(60,64,67,.16) 63px, rgba(60,64,67,.16) 64px)!important;
  border-right:1px solid #e8e6e7!important;
}
#v-calendar .v9-gcal-day.today,
#v-todo .v9-gcal-day.today{ background-color:rgba(139,26,47,.028)!important; }

/* ── En-tête des jours, collant en haut ────────────────────────────────────── */
#v-calendar .v9-gcal-head{
  position:sticky!important; top:0!important; z-index:6!important;
  background:#fff!important;
  border-bottom:1px solid #e4e2e3!important;
  padding-bottom:6px!important;
}
#v-calendar .v9-gcal-head button{
  display:flex!important; flex-direction:column!important;
  align-items:center!important; gap:2px!important;
  padding:8px 0 6px!important; background:none!important;
  border:none!important; cursor:pointer!important;
}
#v-calendar .v9-gcal-head button span{
  font-size:10px!important; font-weight:600!important;
  letter-spacing:.08em!important; text-transform:uppercase!important;
  color:#70757a!important;
}
#v-calendar .v9-gcal-head button strong{
  font-size:22px!important; font-weight:400!important;
  color:#3c4043!important; line-height:1.15!important;
  width:38px!important; height:38px!important; border-radius:50%!important;
  display:flex!important; align-items:center!important; justify-content:center!important;
  transition:background .15s!important;
}
#v-calendar .v9-gcal-head button:hover strong{ background:#f1f3f4!important; }
#v-calendar .v9-gcal-head button.today span{ color:#8b1a2f!important; }
#v-calendar .v9-gcal-head button.today strong{
  background:#8b1a2f!important; color:#fff!important; font-weight:500!important;
}

/* ── Blocs de rendez-vous ──────────────────────────────────────────────────── */
#v-calendar .v9-gcal-event,
#v-todo .v9-gcal-event{
  border:none!important;
  border-left:3px solid var(--agent-color,#8b1a2f)!important;
  border-radius:5px!important;
  background:color-mix(in srgb, var(--agent-color,#8b1a2f) 15%, #fff)!important;
  padding:4px 7px!important;
  overflow:hidden!important;
  text-align:left!important;
  cursor:pointer!important;
  box-shadow:none!important;
  transition:box-shadow .13s, filter .13s!important;
}
#v-calendar .v9-gcal-event:hover,
#v-todo .v9-gcal-event:hover{
  box-shadow:0 1px 3px rgba(60,64,67,.3),0 4px 8px rgba(60,64,67,.15)!important;
  filter:brightness(.97)!important;
  z-index:5!important;
}
#v-calendar .v9-gcal-event strong,
#v-todo .v9-gcal-event strong{
  display:block!important; font-size:11.5px!important; font-weight:600!important;
  line-height:1.25!important; color:#1f1f1f!important;
  white-space:nowrap!important; overflow:hidden!important; text-overflow:ellipsis!important;
}
#v-calendar .v9-gcal-event span,
#v-todo .v9-gcal-event span{
  display:block!important; font-size:10.5px!important; font-weight:400!important;
  color:#3c4043!important; opacity:.85!important;
  white-space:nowrap!important; overflow:hidden!important; text-overflow:ellipsis!important;
}

/* ── Trait de l'heure courante ─────────────────────────────────────────────── */
#v-calendar .v9-now-line,
#v-todo .v9-now-line{ border-top:2px solid #ea4335!important; z-index:4!important; }
#v-calendar .v9-now-line::before,
#v-todo .v9-now-line::before{
  content:""!important; position:absolute!important; left:-5px!important; top:-5px!important;
  width:10px!important; height:10px!important; border-radius:50%!important;
  background:#ea4335!important;
}
#v-calendar .v9-now-line span,
#v-todo .v9-now-line span{
  background:#ea4335!important; color:#fff!important;
  font-size:9px!important; font-weight:600!important;
  padding:1px 5px!important; border-radius:3px!important;
}

/* ── Fiche de rendez-vous éditable ─────────────────────────────────────────── */
.v1127-card{
  position:fixed; z-index:900;
  background:#fff;
  border:1px solid #e4e2e3;
  border-radius:10px;
  box-shadow:0 8px 12px rgba(60,64,67,.16),0 24px 48px rgba(60,64,67,.2);
  font-family:"Inter","Montserrat",sans-serif;
  max-height:calc(100vh - 24px);
  display:flex; flex-direction:column;
  overflow:hidden;
}
.v1127-head{
  display:flex; align-items:flex-start; gap:10px;
  padding:14px 14px 10px 17px;
  border-left:4px solid var(--agent-color,#8b1a2f);
}
.v1127-head small{
  display:block; font-size:10px; font-weight:600;
  letter-spacing:.09em; text-transform:uppercase; color:#70757a;
}
.v1127-head h3{ margin:3px 0 0; font-size:16px; font-weight:600; color:#1f1f1f; line-height:1.3; }
.v1127-x{
  margin-left:auto; flex:0 0 auto;
  width:28px; height:28px; border:none; background:none;
  border-radius:50%; cursor:pointer; font-size:19px; line-height:1; color:#5f6368;
}
.v1127-x:hover{ background:#f1f3f4; }

.v1127-body{ padding:2px 16px 12px; overflow-y:auto; }
.v1127-grid{ display:grid; grid-template-columns:1fr 1fr; gap:9px 10px; }
.v1127-f{ display:flex; flex-direction:column; gap:4px; min-width:0; }
.v1127-f.wide, .v1127-f input.wide{ grid-column:1 / -1; }
.v1127-f > span{
  font-size:10px; font-weight:600; letter-spacing:.07em;
  text-transform:uppercase; color:#70757a;
}
.v1127-f input, .v1127-f select, .v1127-f textarea{
  width:100%; font-family:inherit; font-size:13.5px; color:#1f1f1f;
  border:1px solid #dadce0; border-radius:6px;
  padding:7px 9px; background:#fff; outline:none;
  transition:border-color .13s, box-shadow .13s;
}
.v1127-f textarea{ resize:vertical; line-height:1.5; }
.v1127-f input:focus, .v1127-f select:focus, .v1127-f textarea:focus{
  border-color:#8b1a2f; box-shadow:0 0 0 3px rgba(139,26,47,.1);
}
.v1127-card label.v1127-f.wide{ display:flex; margin-top:10px; }

.v1127-read{ margin:4px 0 0; display:grid; gap:7px; }
.v1127-read div{ display:flex; justify-content:space-between; gap:12px; }
.v1127-read dt{ font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.06em; color:#70757a; }
.v1127-read dd{ margin:0; font-size:13px; color:#1f1f1f; text-align:right; }
.v1127-note-ro{
  margin:10px 0 0; font-size:13px; line-height:1.55; color:#3c4043;
  background:#f8f9fa; border-radius:6px; padding:9px 11px; white-space:pre-wrap;
}
.v1127-veh{ margin:10px 0 0; font-size:12px; color:#5f6368; }
.v1127-msg{ margin:8px 0 0; font-size:12px; color:#8b1a2f; min-height:15px; }

.v1127-foot{
  display:flex; align-items:center; gap:8px;
  padding:11px 14px; border-top:1px solid #eceaeb; background:#fafafa;
}
.v1127-spacer{ flex:1; }
.v1127-foot button{
  font-family:inherit; font-size:13px; font-weight:500;
  border:1px solid #dadce0; background:#fff; color:#3c4043;
  border-radius:6px; padding:7px 14px; cursor:pointer;
  transition:background .13s, border-color .13s;
}
.v1127-foot button:hover{ background:#f1f3f4; }
.v1127-foot .v1127-ok{ background:#8b1a2f; border-color:#8b1a2f; color:#fff; }
.v1127-foot .v1127-ok:hover{ background:#75162a; }
.v1127-foot .v1127-del{ border-color:#e6c3c9; color:#8b1a2f; }
.v1127-foot .v1127-del:hover{ background:#fdf2f4; }

/* ── Téléphone et tablette ─────────────────────────────────────────────────── */
@media (max-width:760px){
  .v1127-card{ left:8px!important; right:8px!important; width:auto!important; }
  .v1127-grid{ grid-template-columns:1fr; }
  #v-calendar .v9-gcal-scroll, #v-todo .v9-gcal-scroll{
    height:480px!important; min-height:480px!important; max-height:480px!important;
  }
  #v-calendar .v9-gcal-head button strong{ font-size:18px!important; width:32px!important; height:32px!important; }
}

/* ══════════════════════════════════════════════════════════════════════════
   v11.28 — EN-TÊTE COMPACT
   L'en-tête occupait plus de 300 px avant que la grille ne commence : sur un
   écran d'ordinateur portable, il ne restait plus la place d'afficher neuf
   heures. Titre réduit, texte explicatif et sur-titre retirés, barre d'outils
   et légende ramenées sur une seule ligne.
   ══════════════════════════════════════════════════════════════════════════ */

/* Sur-titre et paragraphe explicatif : information redondante avec le titre. */
#v-calendar .v9-calendar-eyebrow,
#v-calendar .v9-calendar-header > div > p{ display:none!important; }

#v-calendar .v9-calendar-header{
  padding:10px 16px 8px!important;
  margin:0!important;
  border-bottom:none!important;
  align-items:center!important;
  gap:12px!important;
}
#v-calendar .v9-calendar-header h2{
  font-size:17px!important;
  font-weight:600!important;
  line-height:1.2!important;
  margin:0!important;
  letter-spacing:-.01em!important;
}
#v-calendar .v9-calendar-header-actions{
  gap:8px!important;
  margin:0!important;
  align-items:center!important;
}

#v-calendar .v9-calendar-toolbar{
  padding:0 16px 8px!important;
  margin:0!important;
  border-bottom:none!important;
  gap:10px!important;
  align-items:center!important;
  flex-wrap:wrap!important;
}
#v-calendar .v9-calendar-toolbar strong{ font-size:13px!important; font-weight:600!important; }
#v-calendar .v9-calendar-nav .btn{ padding:5px 10px!important; font-size:12px!important; }
#v-calendar .v9-calendar-view-controls select{ font-size:12px!important; padding:5px 8px!important; height:auto!important; }
#v-calendar .v9-calendar-modes button{ padding:5px 12px!important; font-size:12px!important; }

/* Légende des commerciaux : une ligne fine, collée à la grille. */
#v-calendar .v9-calendar-legend{
  padding:0 16px 7px!important;
  margin:0!important;
  gap:14px!important;
  font-size:11px!important;
  background:transparent!important;
  border:none!important;
  min-height:0!important;
}
#v-calendar .v9-calendar-legend span{ font-size:11px!important; }
#v-calendar .v9-calendar-legend i{ width:8px!important; height:8px!important; }

/* La coquille ne rajoute plus d'espace autour de la grille. */
#v-calendar .v9-calendar-shell{ padding-bottom:0!important; }

/* ══════════════════════════════════════════════════════════════════════════
   v11.28 — PLAGE 10 h → 19 h GARANTIE
   La hauteur vaut exactement neuf heures de grille (9 × 64 px). Associée au
   verrouillage du défilement sur 10 h dans v11.27.js, la journée de travail
   est visible en entier sans manipulation.
   ══════════════════════════════════════════════════════════════════════════ */
#v-calendar .v9-gcal-scroll{
  height:576px!important;
  min-height:576px!important;
  max-height:576px!important;
}

/* Écrans peu hauts : on garde la plage complète en resserrant l'heure. */
@media (max-height:820px){
  #v-calendar .v9-calendar-header h2{ font-size:15px!important; }
  #v-calendar .v9-calendar-header{ padding:8px 16px 6px!important; }
  #v-calendar .v9-gcal-scroll{
    height:calc(100vh - 250px)!important;
    min-height:340px!important;
    max-height:576px!important;
  }
}