/* DSA CRM v11.45 — alignements de précision et déplacement façon calendrier. */
:root{--v1145-bordeaux:#8b1a2f;--v1145-control-h:46px;--v1145-toolbar-w:460px}

/* ── 1. PLANNING : deux colonnes strictement communes aux deux rangées ───── */
#v-calendar .v9-calendar-header,
#v-calendar .v9-calendar-toolbar{
  box-sizing:border-box!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr) minmax(390px,var(--v1145-toolbar-w))!important;
  column-gap:24px!important;
  width:100%!important;
}
#v-calendar .v9-calendar-header{
  align-items:end!important;
  padding:14px 18px 10px!important;
}
#v-calendar .v9-calendar-header>div:first-child{
  min-width:0!important;
  align-self:center!important;
}
#v-calendar .v9-calendar-header-actions{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 146px!important;
  align-items:end!important;
  gap:10px!important;
  width:100%!important;
  min-width:0!important;
}
#v-calendar .v9-calendar-site-select,
#v-calendar .v9-calendar-site-fixed{
  box-sizing:border-box!important;
  width:100%!important;
  min-width:0!important;
  margin:0!important;
}
#v-calendar .v9-calendar-site-select{
  display:grid!important;
  grid-template-rows:14px var(--v1145-control-h)!important;
  gap:5px!important;
}
#v-calendar .v9-calendar-site-select>span,
#v-calendar .v9-calendar-site-fixed>small{
  display:flex!important;
  align-items:center!important;
  min-height:14px!important;
  margin:0!important;
  color:var(--v1145-bordeaux)!important;
  font-size:9.5px!important;
  font-weight:800!important;
  line-height:14px!important;
  letter-spacing:.09em!important;
  text-transform:uppercase!important;
}
#v-calendar .v9-calendar-site-select select,
#v-calendar .v9-calendar-site-fixed,
#v-calendar .v9-calendar-header-actions>.btn{
  box-sizing:border-box!important;
  height:var(--v1145-control-h)!important;
  min-height:var(--v1145-control-h)!important;
  margin:0!important;
  border-radius:11px!important;
}
#v-calendar .v9-calendar-site-select select{
  width:100%!important;
  padding:0 38px 0 14px!important;
  font-size:14px!important;
}
#v-calendar .v9-calendar-header-actions>.btn{
  width:146px!important;
  padding:0 13px!important;
  white-space:nowrap!important;
}
#v-calendar .v9-calendar-site-fixed{
  display:grid!important;
  grid-template-rows:14px 1fr!important;
  gap:4px!important;
  padding:5px 14px 6px!important;
}

#v-calendar .v9-calendar-toolbar{
  align-items:center!important;
  padding:0 18px 12px!important;
}
#v-calendar .v9-calendar-nav{
  min-width:0!important;
  min-height:42px!important;
}
#v-calendar .v9-calendar-view-controls{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) 146px!important;
  align-items:stretch!important;
  gap:10px!important;
  width:100%!important;
  min-width:0!important;
}
#v-calendar .v9-week-kind,
#v-calendar .v9-calendar-modes{
  box-sizing:border-box!important;
  width:100%!important;
  height:42px!important;
  min-height:42px!important;
  margin:0!important;
  border-radius:10px!important;
}
#v-calendar .v9-week-kind{
  min-width:0!important;
  padding:0 34px 0 13px!important;
  font-size:12px!important;
}
#v-calendar .v9-calendar-modes{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  align-items:stretch!important;
  padding:3px!important;
}
#v-calendar .v9-calendar-modes button{
  display:grid!important;
  place-items:center!important;
  min-width:0!important;
  height:34px!important;
  padding:0 8px!important;
}

/* Le bloc suit réellement le pointeur, se cale sur le jour et montre son
   créneau final. La zone en pointillé reste visible sous le bloc déplacé. */
#v-calendar .v9-gcal-event:not(.personal-relance){
  cursor:grab!important;
  user-select:none!important;
  touch-action:none!important;
}
#v-calendar .v9-gcal-event:not(.personal-relance):active{cursor:grabbing!important}
.v1145-calendar-dragging,
.v1145-calendar-dragging *{cursor:grabbing!important}
.v1145-drag-source{opacity:.22!important;filter:saturate(.65)!important}
.v1145-drag-preview{
  position:fixed!important;
  z-index:10020!important;
  margin:0!important;
  pointer-events:none!important;
  opacity:.96!important;
  transform:scale(1.012)!important;
  transform-origin:center!important;
  border-radius:9px!important;
  box-shadow:0 16px 38px rgba(20,18,19,.24),0 3px 10px rgba(20,18,19,.14)!important;
  transition:left 55ms linear,top 55ms linear,width 55ms linear!important;
}
.v1145-drag-preview::after{
  content:attr(data-drop-time)!important;
  position:absolute!important;
  top:-24px!important;
  left:0!important;
  display:grid!important;
  place-items:center!important;
  min-width:46px!important;
  height:20px!important;
  padding:0 7px!important;
  border-radius:999px!important;
  background:var(--agent-color,var(--v1145-bordeaux))!important;
  color:#fff!important;
  font:800 10px/1 Inter,sans-serif!important;
  box-shadow:0 4px 10px rgba(0,0,0,.15)!important;
}
.v1145-drop-slot{
  position:fixed!important;
  z-index:10010!important;
  box-sizing:border-box!important;
  pointer-events:none!important;
  border:2px dashed color-mix(in srgb,var(--v1145-bordeaux) 70%,#fff)!important;
  border-radius:9px!important;
  background:rgba(139,26,47,.055)!important;
}

/* Le sélecteur du responsable reste identifiable à la création comme à
   l'édition : le filet prend exactement la couleur du commercial choisi. */
.v1145-agent-field{position:relative!important}
.v1145-agent-field::after{
  content:"";
  position:absolute;
  right:32px;
  top:calc(50% + 8px);
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--v1145-agent-color,#8a8a8a);
  box-shadow:0 0 0 2px #fff,0 0 0 3px color-mix(in srgb,var(--v1145-agent-color,#8a8a8a) 35%,transparent);
  pointer-events:none;
}
.v1145-agent-select{
  border-left:4px solid var(--v1145-agent-color,#8a8a8a)!important;
  padding-right:34px!important;
}

/* ── 2. BARRE LATÉRALE : un seul axe, une seule largeur ─────────────────── */
.sb-top{
  box-sizing:border-box!important;
  display:grid!important;
  grid-template-columns:minmax(0,1fr)!important;
  align-items:stretch!important;
  gap:9px!important;
  width:100%!important;
  padding:14px 16px 13px!important;
}
.sb-top>.sb-logo,
.sb-top>#sidebar-agency-slot,
.sb-top>.sb-user{
  box-sizing:border-box!important;
  width:100%!important;
  min-width:0!important;
  margin:0!important;
}
.sb-top>.sb-logo{
  height:72px!important;
  padding:8px 12px!important;
  border-radius:12px!important;
}
.sb-top>.sb-logo img{
  width:auto!important;
  max-width:164px!important;
  height:50px!important;
  max-height:50px!important;
  margin:auto!important;
}
.sb-top>#sidebar-agency-slot .v107-agency{
  box-sizing:border-box!important;
  width:100%!important;
  min-height:56px!important;
  margin:0!important;
  padding:8px 12px!important;
  border-radius:11px!important;
}
.sb-top>.sb-user{
  min-height:56px!important;
  padding:8px 12px!important;
  border-radius:11px!important;
}
.nav{padding:8px 0 16px!important}
.nsec{box-sizing:border-box!important;padding-left:18px!important;padding-right:18px!important}
.ni{
  box-sizing:border-box!important;
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  width:100%!important;
  min-height:41px!important;
  padding-left:18px!important;
  padding-right:18px!important;
}
.ni-ic{
  display:grid!important;
  place-items:center!important;
  width:20px!important;
  min-width:20px!important;
  margin:0!important;
  text-align:center!important;
}

/* ── 3. BON DE RÉSERVATION : mêmes bords et mêmes colonnes partout ─────── */
.v113-document-body>#v1138-res-mode,
.v113-document-body>.v9-res-form.v116-res-form.v117-res-form,
.v113-document-body>#v9-res-status,
.v113-document-body>.v9-res-actions{
  box-sizing:border-box!important;
  width:100%!important;
  max-width:1440px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
.v113-document-body>#v1138-res-mode{margin-bottom:16px!important}
.v117-res-form .v117-res-section,
.v117-res-form .v9-res-card-title,
.v117-res-form .v9-res-fields,
.v117-res-form .v9-res-fields>.field,
.v117-res-form .inp,
.v117-res-form .v9-money-input,
.v117-res-form .v116-vehicle-name{
  box-sizing:border-box!important;
}
.v117-res-form .v9-res-card-title{width:100%!important}
.v117-res-form .v9-res-fields{
  grid-auto-flow:row!important;
  align-items:start!important;
  width:100%!important;
}
.v117-res-form .v9-res-fields>.field{
  grid-template-rows:40px minmax(48px,auto) auto!important;
}
.v117-res-form .v9-res-fields>.field>.lbl{
  min-height:40px!important;
  padding:0!important;
  margin:0 0 7px!important;
}
.v117-res-form .v9-res-fields>.field>.inp,
.v117-res-form .v9-res-fields>.field>.v9-money-input,
.v117-res-form .v9-res-fields>.field>.v116-vehicle-name{
  min-height:48px!important;
  margin:0!important;
}
.v117-res-form .v1145-vehicle-wide{grid-column:span 2!important}

@media(max-width:1100px){
  #v-calendar .v9-calendar-header,
  #v-calendar .v9-calendar-toolbar{
    grid-template-columns:minmax(0,1fr)!important;
    row-gap:12px!important;
  }
  #v-calendar .v9-calendar-header-actions,
  #v-calendar .v9-calendar-view-controls{width:100%!important}
  #v-calendar .v9-calendar-view-controls{grid-row:2!important}
  .v117-res-form .v1145-vehicle-wide{grid-column:span 2!important}
}
@media(max-width:700px){
  #v-calendar .v9-calendar-header,
  #v-calendar .v9-calendar-toolbar{padding-left:12px!important;padding-right:12px!important}
  #v-calendar .v9-calendar-header-actions,
  #v-calendar .v9-calendar-view-controls{grid-template-columns:minmax(0,1fr) 124px!important;gap:8px!important}
  #v-calendar .v9-calendar-header-actions>.btn{width:124px!important;padding-inline:8px!important;font-size:12px!important}
  #v-calendar .v9-calendar-nav{display:grid!important;grid-template-columns:38px auto 38px!important;gap:6px!important}
  #v-calendar .v9-calendar-nav strong{grid-column:1/-1!important;margin:2px 0 0!important}
  .v113-document-body>#v1138-res-mode{width:100%!important}
  .v117-res-form .v1145-vehicle-wide{grid-column:auto!important}
  .v117-res-form .v9-res-fields>.field{grid-template-rows:auto auto auto!important}
  .v117-res-form .v9-res-fields>.field>.lbl{min-height:0!important}
}
@media(max-width:460px){
  #v-calendar .v9-calendar-header-actions,
  #v-calendar .v9-calendar-view-controls{grid-template-columns:1fr!important}
  #v-calendar .v9-calendar-header-actions>.btn{width:100%!important}
}