/* Le calendrier des 60 jours et la demande, dans le tiroir « Disponibilités ». */
.dispo { display: grid; gap: 22px; padding-top: 16px; }
.cal-bloc .lib { margin-bottom: 6px; }
.cal { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.cal-dow { font-size: 13px; color: var(--b70); text-align: center; padding: 4px 0; }
.cal-c {
  position: relative; min-height: 44px; display: grid; place-items: center; border-radius: 2px;
  font-size: 16px; color: var(--blanc); background: rgb(255 255 255 / .06);
}
.cal-c:hover:not(:disabled) { background: rgb(255 255 255 / .16); }
.cal-c.is-out { background: none; }
.cal-c:disabled { cursor: default; background: none; color: rgb(255 255 255 / .38); text-decoration: line-through 1px; }
.cal-c[aria-pressed="true"] { background: var(--blanc); color: var(--acajou-p); font-weight: 600; }
.cal-c .m { position: absolute; top: 2px; left: 4px; font-size: 12px; line-height: 1; color: var(--laiton); text-decoration: none; }
.cal-c[aria-pressed="true"] .m { color: var(--acajou); }
.cal-c.is-today::after { content: ""; position: absolute; bottom: 5px; width: 4px; height: 4px; border-radius: 50%; background: var(--laiton); }
.cal-note { margin-top: 10px; font-size: 15px; color: var(--b80); max-width: 46ch; }
.cal-note:empty { display: none; }

.demande { display: grid; gap: 14px; }
.champ .lib { display: block; margin-bottom: 4px; padding: 0; }
.choix { display: grid; gap: 2px; }
.opt { position: relative; display: flex; align-items: center; gap: 12px; min-height: 48px; padding: 6px 12px; border-radius: 2px; background: rgb(255 255 255 / .06); cursor: pointer; }
.opt input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.opt:hover { background: rgb(255 255 255 / .12); }
.opt:has(input:checked) { background: var(--blanc); color: var(--acajou-p); }
.opt:has(input:focus-visible) { outline: 2px solid var(--laiton); outline-offset: 2px; }
.opt .k { font: italic 400 24px/1 var(--d); }
.opt .v { margin-left: auto; font-size: 16px; text-align: right; }
.opt.is-na { cursor: not-allowed; background: none; color: rgb(255 255 255 / .5); }
.opt.is-na .k { text-decoration: line-through 1px; }
.opt .r { display: block; font-size: 14px; }
select {
  width: 100%; min-height: 48px; padding: 0 40px 0 12px; border: 0; border-radius: 2px; font-size: 17px;
  background: rgb(255 255 255 / .06) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='m1 1 5 5 5-5' fill='none' stroke='%23EDB56E' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right 14px center / 12px 8px;
  -webkit-appearance: none; appearance: none; color: var(--blanc);
}
select option { color: #1b1b1b; background: #fff; }
.case { display: flex; align-items: center; gap: 12px; min-height: 48px; cursor: pointer; font-size: 16px; }
.case input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.case-b { flex: none; width: 22px; height: 22px; border: 1.5px solid var(--laiton); border-radius: 2px; display: grid; place-items: center; }
.case input:checked + .case-b { background: var(--blanc); border-color: var(--blanc); }
.case input:checked + .case-b::after { content: ""; width: 10px; height: 6px; border: solid var(--acajou-p); border-width: 0 0 2px 2px; transform: translateY(-1px) rotate(-45deg); }
.case input:focus-visible + .case-b { outline: 2px solid var(--laiton); outline-offset: 3px; }

.recap { padding-top: 12px; border-top: 1px solid rgb(255 255 255 / .14); font-size: 16px; line-height: 1.5; }
.recap p + p { margin-top: 4px; }
.recap .tot { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.recap .tot b { font: 300 34px/1.1 var(--t); }
.recap .ind { color: var(--laiton); font-weight: 500; }
.recap .disc { color: var(--b80); }
.etat { font-size: 15px; color: var(--laiton); min-height: 0; }
.etat:empty { display: none; }
.envoyer { height: 52px; width: 100%; border: 0; }
.envoyer:disabled { opacity: .5; cursor: not-allowed; }

/* Téléphone : le calendrier d'abord, le récapitulatif collé en bas. */
.envoi { display: grid; gap: 10px; }
@media (max-width: 1023px) {
  .demande { display: contents; }
  .envoi { position: sticky; z-index: 1; bottom: calc(max(24px, env(safe-area-inset-bottom)) * -1); margin: 0 calc(var(--bord-d) * -1) calc(max(24px, env(safe-area-inset-bottom)) * -1) calc(var(--bord-g) * -1);
    padding: 12px var(--bord-d) max(16px, env(safe-area-inset-bottom)) var(--bord-g); background: var(--acajou-p); box-shadow: 0 -1px 0 rgb(255 255 255 / .14); }
  .recap { padding-top: 0; }
  .recap { border-top: 0; }
}
@media (min-width: 1280px) {
  .dispo { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); gap: 36px; align-items: start; }
}
@media (min-width: 1024px) and (max-width: 1279px) {
  .dispo { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 32px; align-items: start; }
}
