/* ------------ GENERAL -----------------------------*/

body {
  font-size: 0.9rem;
}

/* Même fond blanc cassé pour les surfaces du formulaire « Ajouter une réservation ». */
body.edit_entry,
body.edit_entry form#main,
body.edit_entry form#main fieldset,
body.edit_entry form#main .standard {
  background-color: #fffdf8 !important;
}
body.edit_entry form#main input[type="text"],
body.edit_entry form#main input[type="email"],
body.edit_entry form#main input[type="number"],
body.edit_entry form#main input[type="date"],
body.edit_entry form#main input[type="time"],
body.edit_entry form#main select,
body.edit_entry form#main textarea {
  background-color: #fffefa !important;
}

/* Variante plus neutre : blanc très légèrement chaud. */
body.edit_entry,
body.edit_entry form#main,
body.edit_entry form#main fieldset,
body.edit_entry form#main .standard { background-color: #fffffd !important; }
body.edit_entry form#main input[type="text"],
body.edit_entry form#main input[type="email"],
body.edit_entry form#main input[type="number"],
body.edit_entry form#main input[type="date"],
body.edit_entry form#main input[type="time"],
body.edit_entry form#main select,
body.edit_entry form#main textarea { background-color: #fffefe !important; }
.messages-page { background: #fffffd !important; }
.messages-header, .messages-compose, .messages-list { background: #fffefd !important; }
.message-card, .message-compose input, .message-compose textarea { background: #fffefe !important; }
.messages-page .messages-icon { width: 4.6rem !important; height: 4.6rem !important; flex-basis: 4.6rem !important; border: 0 !important; background: transparent !important; box-shadow: none !important; color: #347897 !important; font-size: 2.9rem !important; transform: rotate(-12deg) !important; }
.messages-page, .messages-page * { font-family: inherit !important; }
.messages-page { font-size: .9rem !important; line-height: 1.45 !important; }
.messages-page h1 { font-size: 1.3rem !important; font-weight: 750 !important; }
.messages-page h2 { font-size: .95rem !important; font-weight: 700 !important; }
.messages-page h3 { font-size: 1.05rem !important; font-weight: 700 !important; }
.messages-page p, .messages-page label, .messages-page legend { font-size: .8rem !important; line-height: 1.5 !important; }
.messages-page input, .messages-page select, .messages-page textarea, .messages-page button { font-size: .84rem !important; line-height: 1.4 !important; }
.messages-page .message-body { font-size: .88rem !important; line-height: 1.65 !important; }
.messages-page .message-card-top, .messages-page .message-author, .messages-page .message-read-help { font-size: .72rem !important; }
.message-audience-field { margin: 0 0 .15rem; }
.message-audience-field label { margin-top: .7rem; }
.message-compose select#message-audience { display: block; box-sizing: border-box; width: 100%; min-height: 2.3rem; padding: .55rem .65rem; border: 1px solid #cbdce5; border-radius: 7px; background: #fffefe !important; color: #344b5d; font: inherit; font-size: .84rem; line-height: 1.4; }
.message-compose select#message-audience:focus { border-color: #347897; outline: 2px solid rgba(52,120,151,.14); }
.message-audience-choice { margin: .7rem 0 .15rem; padding: 0; border: 0; }
.message-audience-choice legend { margin: 0 0 .3rem; color: #4e6574; font-family: inherit; font-size: .78rem; font-weight: 700; line-height: 1.3; }
.message-audience-options { display: flex; gap: .65rem; flex-wrap: wrap; }
.message-audience-options label { display: inline-flex !important; align-items: center; gap: .45rem; min-height: 2.25rem; margin: 0 !important; padding: .5rem .75rem; border: 1px solid #cbdce5; border-radius: 7px; background: #fffefe; color: #344b5d; cursor: pointer; font-family: inherit; font-size: .82rem !important; font-weight: 600 !important; }
.message-audience-options label:has(input:checked) { border-color: #347897; background: #eef7fa; color: #24536d; box-shadow: 0 3px 8px rgba(52,120,151,.1); }
.message-audience-options input[type="radio"] { width: auto !important; min-height: 0 !important; margin: 0; accent-color: #347897; }

/* Harmonisation finale de la page des annonces avec les pages du site. */
.messages-page{box-sizing:border-box;width:100%;max-width:none;min-height:0;margin:0;padding:1rem 1rem 2rem;background:#fffdf8;color:#344b5d;font-family:inherit}
.messages-shell{width:min(100%,72rem);margin:0 auto}
.messages-header{display:flex;align-items:center;gap:.8rem;min-height:5rem;box-sizing:border-box;margin-bottom:1rem;padding:1.1rem 1.25rem;border:1px solid #d8e5ec;border-left:0;border-radius:14px;background:linear-gradient(120deg,#f7fbfd 0%,#fff 58%,#f5faf8 100%);box-shadow:0 8px 24px rgba(31,62,82,.07);text-align:left}
.messages-header::after{display:none}.messages-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 2.15rem;width:2.15rem;height:2.15rem;margin:0;border:1px solid #d7e6ed;border-radius:11px;background:#fff;color:#347897;box-shadow:0 5px 14px rgba(40,101,132,.12);font-size:1rem;transform:none}
.messages-header h1{margin:.08rem 0 .2rem;color:#17324d;font-size:1.3rem;line-height:1.25}.messages-header p{margin:0;color:#60758a;font-size:.78rem;line-height:1.45}.messages-header .maintenance-kicker{color:#347897;font-size:.7rem;font-weight:800;letter-spacing:.08em}
.messages-compose,.messages-list{margin-top:1rem;padding:1.1rem 1.25rem;border:1px solid #d8e5ec;border-radius:14px;background:#fffefa;box-shadow:0 8px 24px rgba(31,62,82,.055)}
.message-compose h2,.message-list h2{color:#17324d;font-family:inherit;font-size:1rem;font-weight:750;letter-spacing:0}.message-list-heading{padding-bottom:.75rem;border-bottom-color:#e1ebf0}.message-card{margin-top:.75rem;padding:1rem 1.05rem 1.1rem;border:1px solid #d8e5ec;border-radius:11px;background:#fbfdfe;box-shadow:none}.message-card::before{display:none}.message-card h3{color:#24536d;font-size:1.08rem}.message-body{color:#4e6574;font-size:.92rem;line-height:1.7}.message-author{border-top-color:#e1ebf0;color:#7b8d99}.message-compose label{color:#4e6574;font-size:.84rem}.message-compose input,.message-compose textarea{border-color:#cbdce5;border-radius:7px;background:#fbfdfe;color:#344b5d}.messages-page .button{border:1px solid #347897;border-radius:7px;background:#347897;color:#fff;font-family:inherit;font-size:.82rem}.messages-page .button:hover{background:#28647f}
@media (max-width:44rem){.messages-page{padding:.75rem .5rem 1.5rem}.messages-header{padding:1rem}.messages-compose,.messages-list{padding:.9rem}}
.message-card,.message-compose input,.message-compose textarea{background:#fffdf9 !important}
.message-card,.message-compose input,.message-compose textarea{background:#fffdf9 !important}
.messages-page{background:#fffdf8}.messages-header,.messages-compose,.messages-list{background:#fffefa}.message-card{background:#fffdf9}.message-compose input,.message-compose textarea{background:#fffefa}
.messages-page{background:#fffdf8}.messages-header,.messages-compose,.messages-list{background:#fffefa}.message-card{background:#fffdf9}.message-compose input,.message-compose textarea{background:#fffefa}
.message-compose h2,.message-list h2{font-family:inherit !important;letter-spacing:0 !important}

.messages-header{border-left:0}

/* Typographie et proportions alignées sur les formulaires du site. */
.messages-page{font-size:.9rem;line-height:1.45}.messages-header h1{font-size:1.3rem;font-weight:750;letter-spacing:0}.messages-header p{font-size:.78rem}.message-compose h2,.message-list h2{font-family:inherit !important;font-size:.92rem;line-height:1.3;letter-spacing:0}.message-compose-help{margin:.45rem 0 .9rem;font-size:.78rem;line-height:1.5}.message-compose label{display:block;margin:.7rem 0 .3rem;font-size:.78rem;font-weight:700;line-height:1.3}.message-compose input,.message-compose textarea{box-sizing:border-box;width:100%;min-height:2.3rem;padding:.55rem .65rem;font:inherit;font-size:.84rem;line-height:1.4}.message-compose textarea{min-height:7rem;resize:vertical}.messages-page .button{min-height:2.3rem;padding:.5rem .85rem;font-size:.78rem;font-weight:700;line-height:1.2}.message-card h3{margin:.35rem 0 .5rem;font-size:1.05rem;line-height:1.35}.message-body{font-size:.88rem;line-height:1.65}.message-author,.message-card-top{font-size:.72rem;line-height:1.4}.message-read-help{font-size:.68rem;line-height:1.45}
@media (max-width:44rem){.messages-header h1{font-size:1.15rem}.message-card h3{font-size:1rem}.message-body{font-size:.86rem}.message-compose input,.message-compose textarea{font-size:.82rem}}

/* Typographie et proportions alignées sur les formulaires du site. */
.messages-page{font-size:.9rem;line-height:1.45}
.messages-header h1{font-size:1.3rem;font-weight:750;letter-spacing:0}
.messages-header p{font-size:.78rem}
.message-compose h2,.message-list h2{font-size:.92rem;line-height:1.3}
.message-compose-help{margin:.45rem 0 .9rem;font-size:.78rem;line-height:1.5}
.message-compose label{display:block;margin:.7rem 0 .3rem;font-size:.78rem;font-weight:700;line-height:1.3}
.message-compose input,.message-compose textarea{box-sizing:border-box;width:100%;min-height:2.3rem;padding:.55rem .65rem;font:inherit;font-size:.84rem;line-height:1.4}
.message-compose textarea{min-height:7rem;resize:vertical}
.messages-page .button{min-height:2.3rem;padding:.5rem .85rem;font-size:.78rem;font-weight:700;line-height:1.2}
.message-card h3{margin:.35rem 0 .5rem;font-size:1.05rem;line-height:1.35}
.message-body{font-size:.88rem;line-height:1.65}
.message-author,.message-card-top{font-size:.72rem;line-height:1.4}
.message-read-help{font-size:.68rem;line-height:1.45}
@media (max-width:44rem){.messages-header h1{font-size:1.15rem}.message-card h3{font-size:1rem}.message-body{font-size:.86rem}.message-compose input,.message-compose textarea{font-size:.82rem}}

/* Harmonisation avec les pages d’espace personnel et d’administration. */
.messages-page {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  min-height: 0;
  margin: 0;
  padding: 1rem 1rem 2rem;
  background: #f5f9fb;
  color: #344b5d;
  font-family: inherit;
}
.messages-shell { width: min(100%, 72rem); margin: 0 auto; }
.messages-header {
  display: flex;
  align-items: center;
  gap: .8rem;
  min-height: 5rem;
  box-sizing: border-box;
  margin-bottom: 1rem;
  padding: 1.1rem 1.25rem;
  border: 1px solid #d8e5ec;
  border-left: 4px solid #347897;
  border-radius: 14px;
  background: linear-gradient(120deg, #f7fbfd 0%, #fff 58%, #f5faf8 100%);
  box-shadow: 0 8px 24px rgba(31, 62, 82, .07);
  text-align: left;
}
.messages-header::after { display: none; }
.messages-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 2.15rem;
  width: 2.15rem;
  height: 2.15rem;
  margin: 0;
  border: 1px solid #d7e6ed;
  border-radius: 11px;
  background: #fff;
  color: #347897;
  box-shadow: 0 5px 14px rgba(40, 101, 132, .12);
  font-size: 1rem;
  transform: none;
}
.messages-header h1 { margin: .08rem 0 .2rem; color: #17324d; font-size: 1.3rem; line-height: 1.25; }
.messages-header p { margin: 0; color: #60758a; font-size: .78rem; line-height: 1.45; }
.messages-header .maintenance-kicker { color: #347897; font-size: .7rem; font-weight: 800; letter-spacing: .08em; }
.messages-compose, .messages-list {
  margin-top: 1rem;
  padding: 1.1rem 1.25rem;
  border: 1px solid #d8e5ec;
  border-radius: 14px;
  background: #fff;
  box-shadow: 0 8px 24px rgba(31, 62, 82, .055);
}
.message-compose h2, .message-list h2 { color: #17324d; font-size: 1rem; font-weight: 750; }
.message-list-heading { padding-bottom: .75rem; border-bottom-color: #e1ebf0; }
.message-card { margin-top: .75rem; padding: 1rem 1.05rem 1.1rem; border: 1px solid #d8e5ec; border-radius: 11px; background: #fbfdfe; box-shadow: none; }
.message-card::before { display: none; }
.message-card h3 { color: #24536d; font-size: 1.08rem; }
.message-body { color: #4e6574; font-size: .92rem; line-height: 1.7; }
.message-author { border-top-color: #e1ebf0; color: #7b8d99; }
.message-compose label { color: #4e6574; font-size: .84rem; }
.message-compose input, .message-compose textarea { border-color: #cbdce5; border-radius: 7px; background: #fbfdfe; color: #344b5d; }
.messages-page .button { border: 1px solid #347897; border-radius: 7px; background: #347897; color: #fff; font-family: inherit; font-size: .82rem; }
.messages-page .button:hover { background: #28647f; }
@media (max-width: 44rem) {
  .messages-page { padding: .75rem .5rem 1.5rem; }
  .messages-header { padding: 1rem; }
  .messages-compose, .messages-list { padding: .9rem; }
}

/* Ajout et modification d’un utilisateur : formulaire clair et guidé. */
.user-edit-page {
  overflow: hidden;
  padding: 0;
  background: #F8FAFC;
}

.user-edit-page .user-edit-header {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  padding: 1rem 1.15rem;
  border-bottom: 1px solid #D8E2EC;
  background: linear-gradient(125deg, #EAF5FF 0%, #F1EEFF 51%, #EAF9F1 100%);
}

.user-edit-page .user-edit-header-icon {
  display: inline-flex;
  flex: 0 0 2.15rem;
  align-items: center;
  justify-content: center;
  width: 2.15rem;
  height: 2.15rem;
  border: 1px solid rgba(60, 140, 204, 0.22);
  border-radius: 11px;
  background: rgba(255, 255, 255, 0.82);
  color: #2F78AD;
  box-shadow: 0 5px 13px rgba(47, 120, 173, 0.14);
}

.user-edit-page .user-edit-header-icon svg {
  width: 1.2rem;
  height: 1.2rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.user-edit-page .user-edit-header > div {
  min-width: 0;
}

.user-edit-page .user-edit-header .user-edit-title {
  display: block !important;
  width: auto !important;
  margin: 0 0 0.2rem !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #17324D !important;
  box-shadow: none !important;
  font-size: 1.18rem !important;
  font-weight: 750 !important;
  line-height: 1.25 !important;
}

.user-edit-page .user-edit-header .user-edit-title::before {
  content: none !important;
}

.user-edit-page .user-edit-header p {
  margin: 0;
  color: #647C8D;
  font-size: 0.76rem;
  line-height: 1.45;
}

.user-edit-page form.standard#form_edit_users {
  padding: 1rem !important;
}

.user-edit-page form#form_edit_users > fieldset:not(:last-of-type) {
  padding: 0.85rem !important;
  border-color: #DCE8EF !important;
  background: rgba(255, 255, 255, 0.82) !important;
}

.user-edit-page form#form_edit_users > fieldset:not(:last-of-type) > legend {
  border: 0 !important;
  background: transparent !important;
  color: #1B4A62 !important;
  font-size: 0.82rem !important;
  font-weight: 800 !important;
}

.user-edit-page form#form_edit_users > fieldset:not(:last-of-type) > div {
  display: grid;
  grid-template-columns: minmax(11rem, 0.42fr) minmax(0, 0.58fr);
  align-items: center;
  gap: 0.65rem;
  margin-bottom: 0.55rem;
}

.user-edit-page form#form_edit_users > fieldset:not(:last-of-type) > div:last-child {
  margin-bottom: 0;
}

.user-edit-page form#form_edit_users input[type="text"],
.user-edit-page form#form_edit_users input[type="email"],
.user-edit-page form#form_edit_users input[type="password"],
.user-edit-page form#form_edit_users input[type="number"],
.user-edit-page form#form_edit_users select {
  width: 100% !important;
  min-height: 2.25rem;
  box-sizing: border-box;
}

.user-edit-page form#form_edit_users .user-level-select {
  border-width: 1px !important;
  font-weight: 750 !important;
  transition: border-color 150ms ease, background-color 150ms ease, color 150ms ease;
}

.user-edit-page form#form_edit_users .user-level-select[data-level="0"] {
  border-color: #CBD5DF !important;
  background-color: #F3F4F6 !important;
  color: #596A78 !important;
}

.user-edit-page form#form_edit_users .user-level-select[data-level="1"] {
  border-color: #B9DEC9 !important;
  background-color: #ECF9F2 !important;
  color: #256747 !important;
}

.user-edit-page form#form_edit_users .user-level-select[data-level="2"] {
  border-color: #F0C6C2 !important;
  background-color: #FFF0EF !important;
  color: #A5413B !important;
}

.user-edit-page form#form_edit_users .user-level-select[data-level="3"] {
  border-color: #F0D0A6 !important;
  background-color: #FFF3E3 !important;
  color: #A65308 !important;
}

.user-edit-page form#form_edit_users input[type="checkbox"] {
  width: 1.25rem !important;
  height: 1.25rem !important;
  accent-color: #249373;
}

@media (max-width: 44rem) {
  .user-edit-page .user-edit-header {
    gap: 0.6rem;
    padding: 0.8rem;
  }

  .user-edit-page form.standard#form_edit_users {
    padding: 0.75rem !important;
  }

  .user-edit-page form#form_edit_users > fieldset:not(:last-of-type) > div {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.3rem;
  }
}

@media (min-width: 58.01rem) {
  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-site-category {
    display: flex !important;
    width: 100% !important;
    flex: 0 0 100% !important;
    align-self: stretch;
    box-sizing: border-box;
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-site-category {
    margin-top: 0.55rem;
  }
}

/* Paramétrage : les champs restent toujours entièrement visibles. */
.maintenance-page,
.maintenance-settings-layout,
.maintenance-settings-content,
.maintenance-group,
.maintenance-card,
.maintenance-mail-section,
.maintenance-mail-connection-grid,
.maintenance-mail-credentials,
.maintenance-mail-sender-grid {
  min-width: 0;
  max-width: 100%;
  box-sizing: border-box;
}

.maintenance-card input,
.maintenance-card select,
.maintenance-card textarea,
.maintenance-card .maintenance-password-control {
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
}


@media (max-width: 26rem) {
  .user-edit-page form#form_edit_users .submit_buttons {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Cascade finale : mêmes dimensions et disposition que la réservation. */
.user-edit-page form#form_edit_users .submit_buttons {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: nowrap !important;
  gap: 0.6rem !important;
  margin: 0 !important;
  padding: 0 0.85rem 0 0 !important;
}

.user-edit-page form#form_edit_users .submit_buttons > label {
  display: inline-flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  width: auto !important;
  height: 1.75rem !important;
  margin: 0 !important;
  padding: 0 !important;
}

.user-edit-page form#form_edit_users .submit_buttons input[type="submit"] {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 0 !important;
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  max-height: 1.75rem !important;
  margin: 0 !important;
}

@media (max-width: 44rem) {
  .user-edit-page form#form_edit_users .submit_buttons {
    display: flex !important;
    justify-content: flex-start !important;
    padding-right: 0 !important;
  }

  .user-edit-page form#form_edit_users .submit_buttons > label,
  .user-edit-page form#form_edit_users .submit_buttons > input,
  .user-edit-page form#form_edit_users .submit_buttons input[type="submit"] {
    width: auto !important;
    min-width: 0 !important;
  }
}

/* Actions utilisateur identiques à celles d’Ajouter une réservation. */
.user-edit-page form#form_edit_users .submit_buttons {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: nowrap !important;
  gap: 0.6rem !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 0.85rem 0 0 !important;
}

.user-edit-page form#form_edit_users .submit_buttons > label {
  display: inline-flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  width: auto !important;
  height: 1.75rem !important;
  margin: 0 !important;
  padding: 0 !important;
}

.user-edit-page form#form_edit_users .submit_buttons input[type="submit"],
.user-edit-page form#form_edit_users .submit_buttons input[type="submit"].default_action,
.user-edit-page form#form_edit_users input[name="update_button"] {
  flex: 0 0 auto !important;
  width: auto !important;
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  max-height: 1.75rem !important;
  margin: 0 !important;
  border: 0 !important;
  border-radius: 20px !important;
  background-color: #F3F4F6 !important;
  color: #1F2937 !important;
  box-shadow: 0 7px 16px rgba(107, 114, 128, 0.36) !important;
}

.user-edit-page form#form_edit_users .submit_buttons input[type="submit"]:hover,
.user-edit-page form#form_edit_users .submit_buttons input[type="submit"]:focus,
.user-edit-page form#form_edit_users input[name="update_button"]:hover,
.user-edit-page form#form_edit_users input[name="update_button"]:focus {
  background-color: #E5E7EB !important;
  color: #1F2937 !important;
  box-shadow: 0 9px 20px rgba(107, 114, 128, 0.45) !important;
}

@media (max-width: 44rem) {
  .user-edit-page form#form_edit_users .submit_buttons {
    display: flex !important;
    justify-content: flex-start !important;
    padding-right: 0 !important;
  }

  .user-edit-page form#form_edit_users .submit_buttons > label,
  .user-edit-page form#form_edit_users .submit_buttons > input,
  .user-edit-page form#form_edit_users .submit_buttons input[type="submit"] {
    width: auto !important;
    min-width: 0 !important;
  }
}

.banner:not(.simple) {
  font-size: 0.9rem;
}

.banner:not(.simple) .company > a.button {
  font-size: 14px !important;
}

.banner nav a,
.banner nav.logon input,
.banner nav.logon span {
  font-size: 12px;
}

/* Preserve the existing page colors and spacing. */
body {
  font-size: 0.9rem;
  margin: 0;
  padding: 0;
  color: #0B263B;
  font-family: Arial, 'Arial Unicode MS', Verdana, Helvetica, sans-serif;
  background-color: #f9fbfc;
}

/* Use the same typography as the "S'identifier" button everywhere. */
button,
input[type="button"],
input[type="submit"],
input[type="reset"],
input.button,
a.button,
.ui-button {
  font-family: inherit;
  font-weight: bold;
}

/* Keep every navigation and action control consistently bold. */
.banner a,
.banner button,
.banner input,
.banner select,
button,
input[type="button"],
input[type="submit"],
input[type="reset"],
input.button,
a.button,
.ui-button,
nav.view a,
nav.arrow a {
  font-weight: bold !important;
}

/* Every action submit gets an icon; the login/user controls are restored below. */
input[type="submit"] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='8' fill='none' stroke='%23333' stroke-width='2'/%3E%3Cpath fill='none' stroke='%23333' stroke-width='2' d='M12 8v8m-4-4h8'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: 0.65em center;
  background-size: 1.05em 1.05em;
  padding-left: 2.1em;
}

/* Preserve the existing appearance of login and user controls. */
nav.logon input {
  background-image: none;
  background-position: initial;
  background-size: initial;
  padding-left: 1rem;
}

/* Action buttons: keep their labels and add a compact, meaningful icon. */
input[type="submit"][value="Enregistrer"],
input[type="submit"][value="Save"] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23333' stroke-width='2' d='M4 3h13l3 3v15H4zM8 3v6h8V3M8 21v-7h8v7'/%3E%3C/svg%3E");
}

input[type="submit"][value="Retour"],
input[type="submit"][value="Back"] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23333' stroke-width='2' d='M19 12H5m7-7-7 7 7 7'/%3E%3C/svg%3E");
}

input[type="submit"][value="Modifier"],
input[type="submit"][value="Edit"],
input[type="submit"][value^="Éditer"] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23333' stroke-width='2' d='m4 16-1 5 5-1L20 8l-4-4zM14 6l4 4'/%3E%3C/svg%3E");
}

input[type="submit"][value="Supprimer"],
input[type="submit"][value="Delete"],
input[type="submit"][value^="Effacer"] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23333' stroke-width='2' d='M4 7h16m-10 4v6m4-6v6M9 7V4h6v3m-9 0 1 14h8l1-14'/%3E%3C/svg%3E");
}

input[type="submit"][value="Recherche"],
input[type="submit"][value="Search"] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='10.5' cy='10.5' r='6.5' fill='none' stroke='%23333' stroke-width='2'/%3E%3Cpath fill='none' stroke='%23333' stroke-width='2' d='m16 16 5 5'/%3E%3C/svg%3E");
}

input[type="submit"][value="Valider"],
input[type="submit"][value="Approve"] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23333' stroke-width='2.5' d='m4 12 5 5L20 6'/%3E%3C/svg%3E");
}

input[type="submit"][value="Rejeter"],
input[type="submit"][value="Reject"] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23333' stroke-width='2' d='m6 6 12 12M18 6 6 18'/%3E%3C/svg%3E");
}

input[type="submit"][value="Copie"],
input[type="submit"][value="Copy"] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23333' stroke-width='2' d='M8 8h11v13H8zM5 16H3V3h13v2'/%3E%3C/svg%3E");
}

input[type="submit"][value="Impression"],
input[type="submit"][value="Print"] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23333' stroke-width='2' d='M7 9V3h10v6M7 17H4V9h16v8h-3M7 14h10v7H7z'/%3E%3C/svg%3E");
}

input[type="submit"][value="Ajouter un lieu"],
input[type="submit"][value="Ajouter une salle"],
input[type="submit"][value="Add Area"],
input[type="submit"][value="Add Room"] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23333' stroke-width='2' d='M12 5v14M5 12h14'/%3E%3C/svg%3E");
}

input[type="submit"][value="Enregistrer"],
input[type="submit"][value="Save"],
input[type="submit"][value="Retour"],
input[type="submit"][value="Back"],
input[type="submit"][value="Modifier"],
input[type="submit"][value="Edit"],
input[type="submit"][value^="Éditer"],
input[type="submit"][value="Supprimer"],
input[type="submit"][value="Delete"],
input[type="submit"][value^="Effacer"],
input[type="submit"][value="Recherche"],
input[type="submit"][value="Search"],
input[type="submit"][value="Valider"],
input[type="submit"][value="Approve"],
input[type="submit"][value="Rejeter"],
input[type="submit"][value="Reject"],
input[type="submit"][value="Copie"],
input[type="submit"][value="Copy"],
input[type="submit"][value="Impression"],
input[type="submit"][value="Print"],
input[type="submit"][value="Ajouter un lieu"],
input[type="submit"][value="Ajouter une salle"],
input[type="submit"][value="Add Area"],
input[type="submit"][value="Add Room"] {
  background-repeat: no-repeat;
  background-position: 0.65em center;
  background-size: 1.05em 1.05em;
  padding-left: 2.1em;
}

.unsupported_browser body > * {
  display: none;
}

.unsupported_message {
  display: none;
}

.unsupported_browser body .unsupported_message {
  display: block;
}

.current {
  color: #ff0066;  }

.error {
  color: #ff0066;    font-weight: bold;
}

.warning {
  color: #ff0066;  }

.note {
  font-style: italic;
}

input, textarea {
  box-sizing: border-box;
}

input.date,
.js input[type="date"],
input.form-control.input {
  width: 10em;
}

input.form-control.input.flatpickr-mobile {
  width: auto;
}

input.form-control.input {
  text-align: center;
}

input.date {
  text-align: center;
}

button.image {
  background-color: transparent;
  border: 0;
  padding: 0;
}

.contents, .banner {
  padding: 0 1.5rem;
}

.contents {
  float: left;
  width: 100%;
  box-sizing: border-box;
  padding-bottom: 3rem;
}

h1 {
  font-size: x-large;
  clear: both;
}

h2 {
  font-size: large;
  clear: both;
}

.minicalendars {
  padding-top: 0.8rem; }

.minicalendars.formed {
  margin-right: 2em;
  display: none;
}

@media screen and (min-width: 80rem) {

  .minicalendars.formed {
    display: block;
  }
}

.flatpickr-calendar.inline {
  width: auto;
  font-size: 85%;
  margin-bottom: 1rem;
}

.flatpickr-calendar.inline .dayContainer {
  width: calc(7 * 25px);
  min-width: calc(7 * 25px);
  max-width: calc(7 * 25px);
}

.flatpickr-calendar.inline .flatpickr-days {
  width: calc(7 * 25px);
}

.flatpickr-calendar.inline .flatpickr-day {
  max-width: 25px;
  height: 25px;
  line-height: 25px;
}

.flatpickr-months .flatpickr-month {
  height: 40px;
}

.index :not(.simple) + .contents {
  display: -ms-flexbox;
  display: flex;
}

.view_container {
  -ms-flex-positive: 1;
  flex-grow: 1;
  width: 100%;
  overflow-x: auto;
}

img {
  border: 0;
}

a:link {
  color: #0B263B;
  text-decoration: none;
  font-weight: bold;
}

a:visited {
  color: #0B263B;
  text-decoration: none;
  font-weight: bold
}

a:hover {
  color: #0B263B;
  text-decoration: underline;
  font-weight: bold;
}

tr:nth-child(odd) td.new,
.all_rooms tr:nth-child(odd) td {
  background-color: #efefef;
}

tr:nth-child(even) td.new,
.all_rooms tr:nth-child(even) td {
  background-color: #ffffff;
}

.all_rooms td {
  height: 100%; }

.dwm_main.all_rooms td a {
  display: flex;
  height: 100%;
  padding: 0;
}

.all_rooms td a div {
  box-sizing: border-box;
  min-width: 1px;
  width: 0;
  border-right: 1px dotted  #e4e4e4;
  white-space: nowrap;
  overflow: hidden;
  padding: 0.2em 0;
}

.all_rooms td a div:not(.free)::before {
  content: '\00a0';
}

.all_rooms td a:hover {
  text-decoration: none;
}

.all_rooms td a div:last-child,
.all_rooms td a div.free {
  border-right: 0;
}

td, th {
  vertical-align: top;
}

td form {
  margin: 0;  }

legend {
  font-weight: bold;
  font-size: large;
  font-family: Arial, 'Arial Unicode MS', Verdana, Helvetica, sans-serif;
  color: #0B263B;
}

fieldset {
  margin: 0;
  padding: 0;
  border: 0;
  -webkit-border-radius: 8px;
  -moz-border-radius: 8px;
  border-radius: 8px;
}

fieldset.admin {
  width: 100%; padding: 0 1.0em 1.0em 1.0em;
  border: 1px solid #C3CCD3;
}

fieldset fieldset {
  position: relative;
  clear: left;
  width: 100%;
  padding: 0;
  border: 0;
  margin: 0;
}

fieldset fieldset legend {
  font-size: 0;  }

label:not(.link)::after,
label.link a::after,
.list td:first-child::after {
  content: ':';
}

[lang="fr"] label:not(.link)::after,
[lang="fr"] label.link a::after,
[lang="fr"] .list td:first-child::after  {
  content: '\0000a0:';  }

label:empty::after, .group label::after {
  visibility: hidden;
}

label.no_suffix::after,
[lang="fr"] label.no_suffix::after,
.dataTables_wrapper label::after,
.list td.no_suffix:first-child::after {
  content: '';
}


table.admin_table {
  border-collapse: separate;
  border-spacing: 0;
  border-color: #C3CCD3;
}

.admin_table th, .admin_table td,
table.dataTable thead th, table.dataTable thead td,
table.dataTable tbody th, table.dataTable tbody td {
  box-sizing: border-box;
  vertical-align: middle;
  text-align: left;
  padding: 0.1em 24px 0.1em 0.6em;
  border-style: solid;
  border-width: 0 1px 0 0;
}

.admin_table th:first-child, .admin_table td:first-child,
table.dataTable thead th:first-child, table.dataTable thead td:first-child {
  border-left-width: 1px;
}

.admin_table td, .admin_table th,
table.dataTable thead th, table.dataTable thead td {
  border-color: #C3CCD3;
}

.admin_table th:first-child,
table.dataTable thead th:first-child, table.dataTable thead td:first-child {
  border-left-color: #ffffff;
}

.admin_table th:last-child {
  border-right-color: #ffffff;
}

.admin_table.DTFC_Cloned th:last-child {
  border-right-color: #C3CCD3;
}

.admin_table th,
table.dataTable thead .sorting,
table.dataTable thead .sorting_asc,
table.dataTable thead .sorting_desc {
  color: #000000;
  background-color: #ffffff;
}

.admin_table td.action {
  text-align: center;
}

.admin_table td.action div {
  display: inline-block;
}

.admin_table td.action div div {
  display: table-cell;
}

body:not(.js) table.display {
  width: 100%;
}

table.display tbody tr:nth-child(2n) {
  background-color: white;
}

table.display tbody tr:nth-child(2n+1) {
  background-color: #E2E4FF;
}

table.display th, table.display td {
  height: 2em;
  white-space: nowrap;
  overflow: hidden;
}

table.display th {
  padding: 3px 24px 3px 8px;
}

table.display span {
  display: none;
}

table.display span.normal {
  display: inline;
}

select.room_area_select,
nav.location .select2-container {
  margin: 0 0.5em;
}

.none {
  display: none;
}

.js .js_none {
  display: none;
}

.js .js_hidden {
  visibility: hidden;
}

h2.date, span.timezone {
  display: inline-block;
  width: 100%;
  text-align: center;
  margin-bottom: 0.1em;
}

span.timezone {
  opacity: 0.8;
  font-size: smaller;
}

nav.main_calendar {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  width: 100%;
  margin-top: 0.8rem;  }

nav.main_calendar > nav {
  display: -ms-flexbox;
  display: flex;
  -ms-flex: 1;
  flex: 1;
  -ms-flex-pack: center;
  justify-content: center;
}

nav.main_calendar.wrapped nav.location {
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

nav.main_calendar.wrapped nav.location {
  flex-basis: 100%;
}

nav.main_calendar.wrapped:nth-of-type(1) nav.location {
  order: -1;
}

nav.main_calendar.wrapped:nth-of-type(1) nav.location > * {
  margin-bottom: 1em;
}

nav.main_calendar.wrapped:nth-of-type(2) nav.location {
  order: 1;
}

nav.main_calendar.wrapped:nth-of-type(2) nav.location > * {
  margin-top: 1em;
}

nav.main_calendar > nav:first-child {
  -ms-flex-pack: start;
  justify-content: flex-start;
}

nav.main_calendar > nav:last-child {
  -ms-flex-pack: end;
  justify-content: flex-end;
}

nav.view div.container {
  display: inline-grid;
  grid-template-columns: 1fr 1fr 1fr;
}

nav.view a, nav.arrow a {
  background: linear-gradient(#eeeeee, #cccccc);
  border-right: thin solid #f9fbfc;
  cursor: pointer;
  line-height: 1.8em;
  font-weight: normal;
  text-align: center;
}

nav.view a:first-child, nav.arrow a:first-child {
  border-top-left-radius: 5px;
  border-bottom-left-radius: 5px;
}

nav.view a:last-child, nav.arrow a:last-child {
  border-right: 0;
  border-top-right-radius: 5px;
  border-bottom-right-radius: 5px;
}

nav.view a {
  padding: 0.2em 0.5em;
}

nav.arrow a {
  padding: 0.2em 1.1em;
}

nav a.selected,
nav.view a:hover,
nav.view a:focus,
nav.arrow a:hover,
nav.arrow a:focus {
  background: #ffffff;
  box-shadow: inset 1px 1px darkblue;
  color: #000000; // couleur bouton calendrier moi
  text-decoration: none;
}

nav a.prev::before {
  content: '\00276e';  /* HEAVY LEFT-POINTING ANGLE QUOTATION MARK ORNAMENT */
}

nav a.next::after {
  content: '\00276f';  /* HEAVY RIGHT-POINTING ANGLE QUOTATION MARK ORNAMENT */
}


/* ------------ ADMIN.PHP ---------------------------*/

.form_admin fieldset {
  border: 1px solid #C3CCD3;
}

.admin h2 {
  clear: left
}

div#area_form, div#room_form {
  width: 100%;
  float: left;
  padding: 0 0 2em 0;
}

div#div_custom_html {
  float: left;
  padding: 0 0 3em 1em;
}

#area_form form {
  width: 100%;
  float: left;
  margin-right: 1em
}

#area_form label[for="area_select"] {
  display: block;
  float: left;
  font-weight: bold;
  margin-right: 1em;
}

.areaChangeForm div {
  float: left;
}

.roomChangeForm select, .areaChangeForm select {
  font-size: larger;
}

.roomChangeForm input, .areaChangeForm input {
  float: left;
  margin: -0.2em 0.5em 0 0;
}

.roomChangeForm input.button, .areaChangeForm button.image {
  display: block;
  float: left;
  margin: 0 0.7em;
}


/* ------------ INDEX.PHP ------------------*/

.date_nav {
  float: left;
  width: 100%;
  margin-top: 0.5em;
  margin-bottom: 0.5em;
  font-weight: bold
}

.date_nav a {
  display: block;
  width: 33%;
}

.date_before {
  float: left;
  text-align: left;
}

.date_now {
  float: left;
  text-align: center;
}

.date_after {
  float: right;
  text-align: right;
}

.date_before::before {
  content: '<<\0000a0';
}

.date_after::after {
  content: '\0000a0>>';
}

.table_container {
  overflow: auto;
  position: relative;
    max-height: calc(100vh - 4em);
    max-height: max(calc(100vh - 4em), 8em);
  margin: 1em 0;
}

div.timeline {
  background-color: #ffffff;
  position: absolute;
  width: 0;
    height: 2px;   transform: translate(0, -50%);
  z-index: 90;
  pointer-events: none;
}

div.timeline.times_along_top {
  height: 0;
    width: 2px;   transform: translate(-50%, 0);
}

table.dwm_main {
  float: left;
  clear: both;
  width: 100%;
  height: 100%;
  border-spacing: 0;
  border-collapse: separate;
  border-color: #dddddd;
  border-width: 0px;
  border-style: solid;
  border-radius: 5px;
}

.dwm_main th, .dwm_main td {
  min-height: 1.5em;
  line-height: 1.5em;
}

.dwm_main tbody th {
  text-align: left;
}

.dwm_main td {
  position: relative;
  padding: 0;
  border-bottom: 0;
  border-right: 0;
}

.dwm_main td,
.dwm_main tbody td + th {
  border-right: 1px solid #e4e4e4;
}

.series a::before {
  content: '\0021bb';  /* CLOCKWISE OPEN CIRCLE ARROW */
  margin-right: 0.5em;
}

.awaiting_approval a::before {
  content: '?';
  margin-right: 0.5em;
}

.awaiting_approval.series a:before {
  content: '?\002009\0021bb';  /* THIN SPACE, CLOCKWISE OPEN CIRCLE ARROW */
}

.awaiting_approval {
  opacity: 0.6
}

.private {
  opacity: 0.6;
  font-style: italic;
}

.tentative {
  opacity: 0.6;
}

.tentative a {
  font-weight: normal;
}

.capacity::before {
  content: ' (';
}

.capacity::after {
  content: ')';
}

.capacity.zero {
  display: none;
}

.dwm_main thead th,
.dwm_main tfoot th {
  font-size: small;
  font-weight: normal;
  vertical-align: top;
  padding: 0.2em;
  color: #0B263B;
  background-color: #ffffff;
  background-clip: padding-box; }

.dwm_main th,
.dwm_main td {
  border-right: 1px solid #dddddd;
}

.dwm_main thead tr:last-child th {
  border-bottom: 1px solid #ffffff;
}

.dwm_main tfoot tr:first-child th {
  border-top: 1px solid #ffffff;
}

.dwm_main thead tr:first-child th:first-child {
  border-top-left-radius: 5px;
}

.dwm_main thead tr:first-child th:last-child {
  border-top-right-radius: 5px;
}

.dwm_main tfoot tr:last-child th:first-child,
.dwm_main thead + tbody tr:last-child th:first-child {
  border-bottom-left-radius: 5px;
}

.dwm_main tfoot tr:last-child th:last-child,
.dwm_main thead + tbody tr:last-child > *:last-child {
  border-bottom-right-radius: 5px;
}


.dwm_main a,
.dwm_main .booked span.saving {
  display: block;
  height: 100%;
  width: 100%;
  min-height: inherit;
  word-break: break-all;
  word-break: break-word;   hyphens: auto;
}

.dwm_main .booked a,
.dwm_main .booking,
.dwm_main .booked span.saving {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 50;
  overflow: hidden;
}

.dwm_main.times-along-top .booked.multiply a {
  max-height: 1.5em;
  box-sizing: content-box;
}

@media all and (-ms-high-contrast: none), all and (-ms-high-contrast: active)
{
  .dwm_main .booking {
    position: relative;
  }
}

.dwm_main .booking {
  width: 100%;
  height: 100%;   min-height: 1.5em;
}

.dwm_main .booked.multiply a,
.dwm_main .booked.multiply .booking {
  position: relative;
}

.dwm_main .booked.multiply .booking {
  height: 1.5em; }

.dwm_main .booked a {
  box-sizing: border-box;
}

.dwm_main .booked a,
.all_rooms td a div:not(.free) {
  border-bottom: 1px solid #e4e4e4;
}

.dwm_main .booked a.saving {
  opacity: 0.4;
  color: transparent;
  pointer-events: none;
}

.dwm_main .booked span.saving {
  font-weight: bold;
}

.dwm_main .booked span.saving::after,
.loading::after {
  content: '\002026'; }

.dwm_main .booked span.saving,
.dwm_main .booked span.saving::after {
  z-index: 60;
  animation-name: pulsate;
  animation-duration: 2s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
}

@keyframes pulsate {
  from {
    opacity: 0;
  }

  50% {
    opacity: 1;
  }

  to {
    opacity: 0;
  }
}

.dwm_main tbody a {
  padding: 0.2em;
  box-sizing: border-box;
}

.dwm_main th a {
  text-decoration: none;
  font-weight: normal;
}

.dwm_main th a:link {
  color: #0B263B;
}

.dwm_main th a:visited {
  color: #0B263B;
}

.dwm_main th a:hover {
  color: #0B263B;
  text-decoration:underline;
}

.dwm_main thead th.first_last,
.dwm_main tfoot th.first_last {
  width: 1px;
}

.dwm_main#week_main thead th.first_last,
.dwm_main#week_main tfoot th.first_last {
  vertical-align: bottom;
}

.dwm_main td.invalid {
  background-color: #d1d9de;
}

.dwm_main#month_main:not(.all_rooms) tbody tr:not(:first-child) td {
  border-top:  1px solid #e4e4e4;
}

.dwm_main#month_main td.valid {
  background-color: #ffffff;
}

.dwm_main#month_main td.invalid {
  background-color: #F4F4F4;
}

.dwm_main#month_main:not(.all_rooms) a {
  height: 100%;
  width: 100%;
  padding: 0 2px 0 2px;
}

td.new a, a.new_booking {
  font-size: medium;
  text-align: center;
}

td.new img, .new_booking img {
  margin: auto;
  padding: 4px 0 2px 0;
}

.resizable-helper {
  outline: 2px solid #666666;
  outline-offset: -2px;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100 !important;
}



div.cell_container {
  position: relative;
  float: left;
  width: 100%;
  height: 100px;
}

#month_main a.new_booking,
#month_main a.day_overview {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;  }

div.cell_header {
  position: relative;
  width: 100%;
  z-index: 20;    min-height: 20%;
  height: 20%;
  max-height: 20%;
  overflow: hidden;
}

#month_main div.cell_header a {
  display: block;
  width: auto;
  float: left;
}

#month_main div.cell_header a.monthday {
  font-size: medium;
}

#month_main div.cell_header a.week_number {
  opacity: 0.5;
  padding: 2px 4px 0 4px;
}

.view_week_number #month_main div.cell_header a.monthday {
  text-align: center;
}

.view_week_number #month_main div.cell_header a.week_number {
  position: absolute;
}

div.booking_list {
  position: relative;
  z-index: 20;    max-height: 80%;
  font-size: x-small;
  overflow: auto;
}

div.description, div.slot {
  width: 50%;
}

div.both {
  width: 100%;
}

.booking_list div {
  float: left;
  min-height: 1.3em;
  line-height: 1.3em;
  overflow: hidden;
}

  .booking_list div {
    height: 1.3em;
    max-height: 1.3em;
  }
  

.booking_list a {
  font-size: x-small;
}


.A {background: #ffff99}
.full.A {background: linear-gradient(to right bottom, #ffff99 calc(50% - 1.5px), #ffffff calc(50% - 0.5px) calc(50% + 0.5px), #ffff99 calc(50% + 1.5px))}
.spaces.A {background: linear-gradient(to right bottom, #ffffff calc(50% - 0.5px), #ffff99 calc(50% + 0.5px))}
.B {background: #99cccc}
.full.B {background: linear-gradient(to right bottom, #99cccc calc(50% - 1.5px), #ffffff calc(50% - 0.5px) calc(50% + 0.5px), #99cccc calc(50% + 1.5px))}
.spaces.B {background: linear-gradient(to right bottom, #ffffff calc(50% - 0.5px), #99cccc calc(50% + 0.5px))}
.C {background: #ffffcd}
.full.C {background: linear-gradient(to right bottom, #ffffcd calc(50% - 1.5px), #ffffff calc(50% - 0.5px) calc(50% + 0.5px), #ffffcd calc(50% + 1.5px))}
.spaces.C {background: linear-gradient(to right bottom, #ffffff calc(50% - 0.5px), #ffffcd calc(50% + 0.5px))}
.D {background: #cde6e6}
.full.D {background: linear-gradient(to right bottom, #cde6e6 calc(50% - 1.5px), #ffffff calc(50% - 0.5px) calc(50% + 0.5px), #cde6e6 calc(50% + 1.5px))}
.spaces.D {background: linear-gradient(to right bottom, #ffffff calc(50% - 0.5px), #cde6e6 calc(50% + 0.5px))}
.E {background: #6dd9c4}
.full.E {background: linear-gradient(to right bottom, #6dd9c4 calc(50% - 1.5px), #ffffff calc(50% - 0.5px) calc(50% + 0.5px), #6dd9c4 calc(50% + 1.5px))}
.spaces.E {background: linear-gradient(to right bottom, #ffffff calc(50% - 0.5px), #6dd9c4 calc(50% + 0.5px))}
.F {background: #82adad}
.full.F {background: linear-gradient(to right bottom, #82adad calc(50% - 1.5px), #ffffff calc(50% - 0.5px) calc(50% + 0.5px), #82adad calc(50% + 1.5px))}
.spaces.F {background: linear-gradient(to right bottom, #ffffff calc(50% - 0.5px), #82adad calc(50% + 0.5px))}
.G {background: #9ADFC0}
.full.G {background: linear-gradient(to right bottom, #9ADFC0 calc(50% - 1.5px), #ffffff calc(50% - 0.5px) calc(50% + 0.5px), #9ADFC0 calc(50% + 1.5px))}
.spaces.G {background: linear-gradient(to right bottom, #ffffff calc(50% - 0.5px), #9ADFC0 calc(50% + 0.5px))}
.H {background: #d9d982}
.full.H {background: linear-gradient(to right bottom, #d9d982 calc(50% - 1.5px), #ffffff calc(50% - 0.5px) calc(50% + 0.5px), #d9d982 calc(50% + 1.5px))}
.spaces.H {background: linear-gradient(to right bottom, #ffffff calc(50% - 0.5px), #d9d982 calc(50% + 0.5px))}
.I {background: #9ADFC0}
.full.I {background: linear-gradient(to right bottom, #9ADFC0 calc(50% - 1.5px), #ffffff calc(50% - 0.5px) calc(50% + 0.5px), #9ADFC0 calc(50% + 1.5px))}
.spaces.I {background: linear-gradient(to right bottom, #ffffff calc(50% - 0.5px), #9ADFC0 calc(50% + 0.5px))}
.J {background: #9ADFC0}
.full.J {background: linear-gradient(to right bottom, #9ADFC0 calc(50% - 1.5px), #ffffff calc(50% - 0.5px) calc(50% + 0.5px), #9ADFC0 calc(50% + 1.5px))}
.spaces.J {background: linear-gradient(to right bottom, #ffffff calc(50% - 0.5px), #9ADFC0 calc(50% + 0.5px))}

.full a,
.spaces a {
  background: transparent;
}

tbody tr:nth-child(odd) .spaces {
  box-shadow: 0 1px 0 #efefef inset;
}

.private_type {
  background: #d1d9de;
}

.dwm_main thead th,
.dwm_main th:first-child {
  position: -webkit-sticky;
  position: sticky;
  z-index: 600;
}

.dwm_main thead th {
  top: 0;
}

.dwm_main th:first-child {
  left: 0;
}

.dwm_main thead th:first-child {
  z-index: 610;
}

.hidden_day {
  display: none;
}

td.hidden_day {
  background-color: #C3CCD3;
  font-size: medium;
  font-weight: bold;
}

tr.row_highlight td.new {
  background-color: #E1EDD7;
}

th {
  white-space: nowrap;
  vertical-align: middle;
}

tbody tr:nth-child(odd) th {
  background-color: #efefef;
}

tbody tr:nth-child(even) th {
  background-color: #ffffff;
}

tbody th a {
  display: inline-block;
  text-decoration: none;
  font-weight: normal
}

tbody th a:link {
  color: #0B263B;
}

tbody th a:visited {
  color: #0B263B;
}

tbody th a:hover {
  color: #0B263B;
  text-decoration: underline;
}

.dwm_main td:hover.new, .dwm_main td.new_hover {
  background-color: #E1EDD7;
}

.dwm_main tbody tr:hover th {
  background-color: #E1EDD7;
}

.dwm_main tbody tr:hover th a {
  color: #000000f;
}

.dwm_main#month_main td:hover.valid,
.dwm_main#month_main td.valid_hover {
  background-color: #E1EDD7;
}

.dwm_main.resizing tbody tr:nth-child(odd) td:hover.new {
  background-color: #efefef;
}

.dwm_main.resizing tbody tr:nth-child(even) td:hover.new {
  background-color: #ffffff;
}

.dwm_main.resizing tbody tr:hover th {
  background-color: #ffffff;
  color: #0B263B;
}

.resizing tbody th a:hover {
  text-decoration: none;
}

.dwm_main.resizing tbody tr:hover th a:link {
  color: #0B263B;
}

.dwm_main.resizing tbody tr:hover th a:visited {
  color: #0B263B;
}

.dwm_main.resizing tbody tr th.selected {
  background-color: #E1EDD7;
}

.dwm_main.resizing tbody tr:hover th.selected,
.dwm_main.resizing tbody tr th.selected a:link,
.dwm_main.resizing tbody tr th.selected a:visited {
  color: #ffffff;
}


.dwm_main .ui-resizable-n {
  top: -1px;
}

.dwm_main .ui-resizable-e {
  right: -1px;
}

.dwm_main .ui-resizable-s {
  bottom: -1px;
}

.dwm_main .ui-resizable-w {
  left: -1px;
}

.dwm_main .ui-resizable-se {
  bottom: 0;
  right: 0;
}

.dwm_main .ui-resizable-sw {
  bottom: -2px;
  left: -1px;
}

.dwm_main .ui-resizable-ne {
  top: -2px;
  right: -1px;
}

.dwm_main .ui-resizable-nw {
  top: -2px;
  left: -1px;
}


div.div_select {
  position: absolute;
  border: 0;
  opacity: 0.2;
  background-color: #ffffff;
}

div.div_select.outside {
  background-color: transparent;
}


/* ------------ DEL.PHP -----------------------------*/
div#del_room_confirm {
  text-align: center;
  padding-bottom: 3em;
}

#del_room_confirm p, #del_room_confirm input[type="submit"] {
  font-size: large;
  font-weight: bold;
}

#del_room_confirm form {
  display: inline-block;
  margin: 1em 2em;
}



/* ------ EDIT_AREA.PHP AND EDIT_ROOM.PHP ----------*/

#book_ahead_periods_note span {
  display: block;
  float: left;
  width: 24em;
  margin: 0 0 1em 1em;
  font-style: italic;
}

div#div_custom_html {
  margin-top: 2em;
}

.delete_period, #period_settings button {
  display: none;
}

.js .delete_period {
  display: inline-block;
  visibility: hidden;   padding: 0 1em;
  opacity: 0.7;
}

.delete_period::after {
  content: '\002718';    color: red;
}

.delete_period:hover {
  cursor: pointer;
  opacity: 1;
  font-weight: bold;
}

.js #period_settings button {
  display: inline-block;
  margin-left: 1em;
}

.buttons input {
  margin-top: 2em;
}



.standard {
  float:left;
  margin-top: 2.0em;
}

.standard fieldset {
  display: table;
  float: left;
  clear: left;
  width: auto;
  border-spacing: 0 0.75em;
  border-collapse: separate;
  padding: 1em 1em 1em 0;
}

.standard#logon fieldset {
  padding-bottom: 0;
}

.standard fieldset > div {
  display: table-row;
}

.standard fieldset > div > *:not(.none) {
  display: table-cell;
  vertical-align: middle;
}

.standard fieldset .multiline label {
  vertical-align: top;
}

.standard fieldset .field_text_area label {
  vertical-align: top;
  padding-top: 0.2em;
}

.standard fieldset > div > div > * {
  float: left;
  margin-top: 0;
}

.standard ul {
  clear: left;
}

.reset_password .standard p {
  float: left;
  clear: left;
}

.standard fieldset fieldset {
  padding: 1em 0;
}

.standard fieldset fieldset legend{
  font-size: small;
  font-style: italic;
  font-weight: normal;
}

.standard fieldset fieldset fieldset legend {
  padding-left: 2em;
}

.standard fieldset > div > label {
  font-weight: bold;
  padding-left: 2em;
  padding-right: 1em;
  text-align: right;
}

.standard fieldset > div > div {
  text-align: left;
}

.standard div.group {
  display: inline-block;
  float: left;
}

.standard div.group.long label {
  float: left;
  clear: left;
  margin-bottom: 0.5em;
}

.standard input[type="text"]:not(.date):not(.form-control),
.standard input[type="email"],
.standard input[type="password"],
.standard input[type="search"],
.standard textarea {
  width: 17rem;  }

.standard input[type="text"].short {
  width: 4em;
}

.standard input[type="number"] {
  width: 4em;
}

.standard input[type="number"][step="0.01"] {
  width: 6em;
}

.standard input[type="radio"], .standard input[type="checkbox"] {
  vertical-align: middle;
  margin: -0.17em 0.4em 0 0;
}

.standard input, .standard input.enabler, .standard select {
  margin-right: 1em;
}

.standard textarea {
  height: 6em;
}

.standard .group label {
  margin-right: 0.5em;
}

@media (max-width: 30rem) {
  .standard fieldset {
    display: block;
  }

  .standard fieldset > div {
    display: block;
    float: left;
    clear: left;
  }

  .standard fieldset div > * {
    margin-bottom: 1em;
  }

  .standard fieldset > div > *:not(label):not(.none) {
    display: inline-block;
    vertical-align: middle;
  }

  .standard fieldset > div > label {
    display: block;
    text-align: left;
    padding-left: 0;
    padding-right: 0;
    margin-bottom: 0.2em;
  }

  .standard fieldset.rep_type_details {
    padding-bottom: 0;
    margin-bottom: 0;
  }

  .standard input#rep_interval {
    float: left;
  }

  .standard div#rep_type div.long {
    border-right: 0;
  }

  .standard .submit_buttons > * {
    float: left;
  }
}

/* Vue journalière : cartes lisibles même avec plusieurs réservations. */
body.index[data-view="day"] #day_main {
  table-layout: fixed;
}

body.index[data-view="day"] #day_main thead th:first-child,
body.index[data-view="day"] #day_main tbody th {
  width: 7.25rem;
}

body.index[data-view="day"] #day_main tbody th {
  padding: 0 0.55rem;
  border-right: 1px solid #D9E5EC;
  background: #F5F8FA;
  color: #607486;
  font-size: 0.67rem;
  font-variant-numeric: tabular-nums;
  font-weight: 750;
  text-align: center;
}

body.index[data-view="day"] #day_main tbody th a {
  color: #607486;
  text-decoration: none;
}

body.index[data-view="day"] #day_main tbody tr:nth-child(odd) th {
  background: #F2F6F8;
}

body.index[data-view="day"] #day_main td.new {
  background: #FFFFFF;
  box-shadow: inset 0 -1px #EDF2F5;
}

body.index[data-view="day"] #day_main td.new:hover {
  background: #F0FAF6;
  box-shadow: inset 4px 0 rgba(36, 147, 115, 0.22), inset 0 -1px #DDECE6;
}

body.index[data-view="day"] #day_main td.booked {
  background: #F7FAFB;
}

body.index[data-view="day"] #day_main td.booked .booking {
  top: 3px;
  left: 4px;
  width: calc(100% - 8px);
  height: calc(100% - 6px);
  min-height: 2.7rem;
  overflow: visible;
  border: 1px solid #C9E3D7;
  border-left: 4px solid #249373;
  border-radius: 9px;
  background: linear-gradient(135deg, #F2FBF7 0%, #F8FCFE 100%) !important;
  box-shadow: 0 3px 9px rgba(23, 50, 77, 0.08) !important;
}

body.index[data-view="day"] #day_main td.booked .booking > a {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  gap: 0.24rem;
  padding: 0.48rem 0.65rem !important;
  border: 0 !important;
  border-radius: 7px;
  background: transparent !important;
  color: #24485B !important;
  text-decoration: none;
}

body.index[data-view="day"] #day_main td.booked .booking > a:hover,
body.index[data-view="day"] #day_main td.booked .booking > a:focus {
  background: rgba(221, 244, 237, 0.62) !important;
  box-shadow: inset 0 0 0 2px rgba(36, 147, 115, 0.12);
}

body.index[data-view="day"] #day_main .booking_time {
  display: inline-flex;
  align-items: center;
  min-height: 1.15rem;
  padding: 0.08rem 0.38rem;
  border-radius: 999px;
  background: #DDF4ED;
  color: #176B58;
  font-size: 0.64rem;
  font-variant-numeric: tabular-nums;
  font-weight: 850;
  letter-spacing: 0.02em;
  line-height: 1.15;
  white-space: nowrap;
}

body.index[data-view="day"] #day_main .booking_name {
  display: block;
  width: 100%;
  overflow: hidden;
  color: #24485B;
  font-size: 0.76rem;
  font-weight: 750;
  line-height: 1.3;
  overflow-wrap: anywhere;
}

body.index[data-view="day"] #day_main td.booked.multiply {
  padding: 0.14rem 0;
}

body.index[data-view="day"] #day_main td.booked.multiply .booking {
  position: relative;
  top: auto;
  left: auto;
  width: calc(100% - 8px);
  height: auto;
  min-height: 3.35rem;
  margin: 0.26rem 4px;
}

@media (max-width: 40rem) {
  body.index[data-view="day"] .table_container {
    border-radius: 10px;
  }

  body.index[data-view="day"] #day_main thead th:first-child,
  body.index[data-view="day"] #day_main tbody th {
    width: 5.35rem;
  }

  body.index[data-view="day"] #day_main tbody th {
    padding: 0 0.25rem;
    font-size: 0.6rem;
  }

  body.index[data-view="day"] #day_main td.booked .booking > a {
    padding: 0.4rem 0.48rem !important;
  }

  body.index[data-view="day"] #day_main .booking_name {
    font-size: 0.7rem;
  }
}

/* Le bouton de demande doit rester visible dans toutes les alertes de quota,
 * y compris pour un compte disposant aussi de droits administrateur. */
#policy_details.has-rule-issue button.quota-increase-request-button,
.booking-conflict-message input.quota-increase-request-button {
  position: relative !important;
  z-index: 2 !important;
  display: inline-flex !important;
  visibility: visible !important;
  width: auto !important;
  max-width: 100% !important;
  opacity: 1 !important;
  white-space: normal !important;
}


.standard fieldset.max_limits > div > label {
  vertical-align: top;
  margin-bottom: 0.5em;
}

.max_limits div:first-of-type span {
  display: inline-block;
  width: 50%;
}

.max_limits div div div {
  float: left;
  margin-bottom: 0.5em;
}

.max_limits div:first-of-type span {
  white-space: normal;
  font-style: italic;
}

.max_limits div div {
  white-space: nowrap;
}

.max_limits input {
  display: inline-block;
}

.max_limits input[type="checkbox"] {
  margin-right: 1em;
}

div#rep_type div.long{
  border-right: 1px solid #C3CCD3;
  padding-right: 1em;
}

fieldset.rep_type_details fieldset {
  padding-top: 0
}

#rep_monthly input[type="radio"] {
  margin-left: 2em;
}

.standard fieldset fieldset.rep_type_details {
  padding-top: 0;
  clear: none;
}

fieldset#rep_info,
fieldset#booking_controls {
  border-top: 1px solid #C3CCD3;
  border-radius: 0;
  padding-top: 0.7em;
}

span#interval_units {
  display: inline-block;
}

.edit_entry span#end_time_error {
  display: block;
  float: left;
  margin-left: 2em;
  font-weight: normal;
}

div#checks {
  white-space: nowrap;
  letter-spacing: 0.9em;
  margin-left: 3em;
}

div#checks span {
  cursor: pointer;
}

.good::after {
  content: '\002714';    color: green;
}

.notice::after {
  content: '!';
  font-weight: bold;
  color: #ff5722;
}

.bad::after {
  content: '\002718';    color: red;
}


/* ------------ EDIT_ENTRY_HANDLER.PHP ------------------*/

.edit_entry_handler div#submit_buttons {
  float: left;
}

.edit_entry_handler #submit_buttons form {
  float: left;
  margin: 1em 2em 1em 0;
}


/* ------------ EDIT_USERS.PHP ------------------*/

div#user_list {
  padding: 2em 0;
}

form#add_new_user {
  margin-left: 1em;
}

#users_table td {
  text-align: right;
}

#users_table td div.string {
  text-align: left;
}


/* ------------ FUNCTIONS.INC -------------------*/

.banner {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-pack: start;
  justify-content: flex-start;
  background-color: #ffffff;
  color: #000000;
  border-color: #f9fbfc;
  border-width: 0px;
  border-style: solid;
}

.banner .logo {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: start;
  justify-content: flex-start;
}

.banner .logo img {
  display: block;
  margin: 1em 2em 1em 0;
}

.banner .company {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: column;
  flex-direction: column;
  -ms-flex-align: center;
  align-items: center;
  -ms-flex-pack: center;
  justify-content: center;
  font-size: large;
  padding: 0.5rem 2rem 0.5rem 0;
  margin-right: 2rem;
  white-space: nowrap;
}

.banner .company > * {
  display: -ms-flexbox;
}

.banner a:link, .banner a:visited, .banner a:hover {
  text-decoration: none;
  font-weight: normal;
}

.banner a:link, nav.logon input {
  color: #000000;
}

.banner a:visited {
  color: #000000;
}

.banner a:hover {
  color: #000000;
}

.banner nav.container {
  width: 50%;
  -ms-flex-positive: 1;
  flex-grow: 1;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row-reverse;
  flex-direction: row-reverse;
  justify-content: space-between;
  align-items: stretch;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  padding: 0.70em 0;
}

.banner nav.container > nav {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-direction: row;
  flex-direction: row;
  -ms-flex-align: stretch;
  align-items: stretch;
  justify-content: flex-end;
  padding: 0.3em 0;
}

.banner nav.container > nav > nav {
  -ms-flex-align: center;
  align-items: center;
}

.banner nav.container > nav:first-child {
  -ms-flex-wrap: wrap-reverse;
  flex-wrap: wrap-reverse;
}

.banner nav.container > nav:last-child > * {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

nav.menu, nav.logon {
  margin-left: 1rem;
  padding-left: 1rem;
}

nav.menu {
  display: -ms-flexbox;
  display: flex;
  
}

nav.logon {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-align: center;
  align-items: center;
}

nav.logon input {
  background-color:"#E9E9E9";
  border: none;  ////#####///
}

.banner nav a,
nav.logon input,
nav.logon span {
  display: inline-block;
  text-align: center;
  padding: 0.3rem 1rem;
  line-height: 1.4em;
  border-radius: 0.8em;
}

/* Main menu and quick links: icons with the existing labels and styling. */
.banner nav.menu a.menu-item,
.banner nav.quick-links a.quick-access,
.banner nav.quick-links a.quick-calendar {
  background-repeat: no-repeat;
  background-position: 0.7em center;
  background-size: 1.05em 1.05em;
  padding-left: 2.15em;
}

.banner nav.menu a.menu-kiosk {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='4' y='5' width='16' height='14' rx='2' fill='none' stroke='%23333' stroke-width='2'/%3E%3Cpath fill='none' stroke='%23333' stroke-width='2' d='M8 9h8M8 13h5'/%3E%3C/svg%3E");
}

.banner nav.menu a.menu-rooms {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23333' stroke-width='2' d='M4 20V5h16v15M8 9h2m4 0h2M8 13h2m4 0h2M8 20v-3h3v3m2-11h3'/%3E%3C/svg%3E");
}

.banner nav.menu a.menu-user_list {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='8' r='3' fill='none' stroke='%23333' stroke-width='2'/%3E%3Cpath fill='none' stroke='%23333' stroke-width='2' d='M5 20c.7-3.4 3.1-5 7-5s6.3 1.6 7 5'/%3E%3C/svg%3E");
}

.banner nav.quick-links a.quick-access {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23333' stroke-width='2' d='M12 5v14M5 12h14'/%3E%3C/svg%3E");
}

.banner nav.quick-links a.quick-calendar {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='4' y='5' width='16' height='15' rx='2' fill='none' stroke='%23333' stroke-width='2'/%3E%3Cpath fill='none' stroke='%23333' stroke-width='2' d='M8 3v4m8-4v4M4 10h16'/%3E%3C/svg%3E");
}

.banner nav.user-nav a.quick-add-booking {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23333' stroke-width='2.5' d='M12 5v14M5 12h14'/%3E%3C/svg%3E");
}

@media (min-width: 58.01rem) {
  .banner .company > a.button[href="edit_entry.php"] {
    display: none !important;
  }
}

/* Les anciennes options Paramètres restent visibles directement dans le menu. */
.banner nav.user-nav nav.settings-direct-menu {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  margin: 0 !important;
  padding: 0 !important;
}

.banner nav.user-nav details.settings-mobile-menu {
  display: none !important;
}

.banner nav.user-nav nav.settings-direct-menu .settings-submenu-link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  box-sizing: border-box !important;
  padding: 0.3rem 0.75rem 0.3rem 1.75em !important;
  border-radius: 0.8em !important;
  background: #F3F4F6 !important;
  color: #1F2937 !important;
  font-size: 0.8rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
}

@media (max-width: 58rem) {
  .banner nav.user-nav details.settings-mobile-menu {
    display: block !important;
    position: relative !important;
  }

  .banner nav.user-nav details.settings-mobile-menu > summary.settings-mobile-button {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    height: 1.75rem !important;
    min-height: 1.75rem !important;
    padding: 3px 20px 3px 2em !important;
    border-radius: 20px !important;
    background: #D1D5DB !important;
    color: #1F2937 !important;
    font-size: 0.8rem !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    list-style: none !important;
    cursor: pointer;
  }

  .banner nav.user-nav details.settings-mobile-menu > summary.settings-mobile-button::-webkit-details-marker {
    display: none !important;
  }

  .banner nav.user-nav details.settings-mobile-menu .settings-mobile-submenu {
    position: absolute !important;
    top: calc(100% + 0.35rem) !important;
    left: 0 !important;
    z-index: 1000 !important;
    display: flex !important;
    flex-direction: column !important;
    gap: 0.35rem !important;
    min-width: 12rem !important;
    padding: 0.5rem !important;
    border-radius: 0.65rem !important;
    background: #FFFFFF !important;
    box-shadow: 0 8px 18px rgba(23, 50, 77, 0.22) !important;
  }

  .banner nav.user-nav details.settings-mobile-menu .settings-submenu-link {
    height: 1.5rem !important;
    min-height: 1.5rem !important;
    padding: 0.2rem 0.55rem !important;
    border-radius: 0.65em !important;
    background: #F3F4F6 !important;
    color: #1F2937 !important;
    font-size: 0.7rem !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    text-decoration: none !important;
  }

  .banner nav.user-nav nav.settings-direct-menu {
    display: none !important;
  }

  .banner nav.user-nav nav.settings-direct-menu {
    gap: 0.35rem !important;
    flex-wrap: nowrap !important;
    overflow-x: auto !important;
  }

  .banner nav.user-nav nav.settings-direct-menu .settings-submenu-link {
    height: 1.5rem !important;
    min-height: 1.5rem !important;
    padding: 0.2rem 0.55rem !important;
    border-radius: 0.65em !important;
    font-size: 0.7rem !important;
  }
}

@media (max-width: 58rem) {
  .banner nav.user-nav a.quick-add-booking {
    display: none !important;
  }

  .banner .company > a.button[href="edit_entry.php"] {
    display: inline-flex !important;
    background-image: none !important;
  }

  .banner .company > a.button[href="edit_entry.php"]::before {
    content: '';
    display: inline-block;
    width: 1em;
    height: 1em;
    margin-right: 0.45em;
    flex: 0 0 1em;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='5' width='18' height='16' rx='2' fill='none' stroke='%230F766E' stroke-width='2'/%3E%3Cpath fill='none' stroke='%230F766E' stroke-width='2' stroke-linecap='round' d='M8 3v4M16 3v4M3 10h18M12 13v5M9.5 15.5h5'/%3E%3C/svg%3E") center / contain no-repeat;
  }
}

/* Login and connected-user controls. */
nav.user-nav input[value="S'identifier"],
nav.user-nav input[value="Log in"] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='8' r='3' fill='none' stroke='%23333' stroke-width='2'/%3E%3Cpath fill='none' stroke='%23333' stroke-width='2' d='M5 20c.7-3.4 3.1-5 7-5s6.3 1.6 7 5'/%3E%3C/svg%3E");
}

nav.user-nav input[value="Se déconnecter"],
nav.user-nav input[value="Log off"] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='9' cy='8' r='3' fill='none' stroke='%23333' stroke-width='2'/%3E%3Cpath fill='none' stroke='%23333' stroke-width='2' d='M2 20c.7-3.4 3.1-5 7-5 2 0 3.6.5 4.8 1.5M15 12h7m-3-3 3 3-3 3'/%3E%3C/svg%3E");
}

nav.user-nav input[value="S'identifier"],
nav.user-nav input[value="Log in"],
nav.user-nav input[value="Se déconnecter"],
nav.user-nav input[value="Log off"],
nav.user-nav #show_my_entries input[type="submit"] {
  background-repeat: no-repeat;
  background-position: 0.7em center;
  background-size: 1.05em 1.05em;
  padding-left: 2.15em;
}

nav.user-nav #show_my_entries input[type="submit"] {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='8' r='3' fill='none' stroke='%23333' stroke-width='2'/%3E%3Cpath fill='none' stroke='%23333' stroke-width='2' d='M5 20c.7-3.4 3.1-5 7-5s6.3 1.6 7 5'/%3E%3C/svg%3E");
}

.banner a.attention {
  background-color: darkorange;
}

.banner nav a:hover,
nav.logon input:hover {
  background-color: #ffffff;
  color: #000000; // couleur texte bouton menu
}

#form_nav {
  padding-right: 0.2rem;
  margin-right: 0.2rem;
}

input.link[type="submit"] {
  display: inline;
  border: none;
  background: none;
  cursor: pointer;
  font-weight: bold;
  padding: 0;
}

form#show_my_entries input.link[type="submit"] {
  color: #000000;
  padding: 0.3em 0;
  font-weight: normal;
}

@media (max-width: 20rem) {
  .banner .logo {
    display: none;
  }


  .banner .company {
    align-items: flex-start;
  }

  .banner .company_more_info {
    display: none;
  }

    .index #form_nav input[type="submit"] {
    display: none;
  }
}


.color_key {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
}

.color_key {
  display: inline-grid;
  grid-template-columns: repeat(auto-fill, minmax(20ch, 1fr));
  width: 100%;
  margin-top: 1em;
}

.color_key > div {
  width: 12em;
  color: #0B263B;
  word-wrap: break-word;
  padding: 0.3em;
  margin: -1px 0 0 -1px;   font-weight: bold;
  border: 1px solid #ffffff}

@supports (display: grid) {
  .color_key > div {
    width: auto;
  }
}



header input[type="search"] {
  width: 10em;
}

/* EspaceSt navigation refresh */
.banner:not(.simple) {
  align-items: center;
  gap: 0.75rem;
  padding: 0.45rem 2rem;
  background: #ffffff;
  color: #17324d;
  border: 0;
  border-bottom: 1px solid #e5ebf2;
  box-shadow: 0 4px 18px rgba(23, 50, 77, 0.08);
}

.banner:not(.simple) .logo img {
  max-width: 128px;
  max-height: 81px;
  width: auto;
  margin: 0.35rem 1rem 0.35rem 0;
  transform: translateX(5px);
}

@media (min-width: 58.01rem) {
  .banner:not(.simple) {
    position: relative;
  }

  .banner:not(.simple) .logo {
    height: 78px;
    box-sizing: border-box;
    overflow: visible;
  }

  .banner:not(.simple) .logo img {
    max-width: 126px;
    max-height: 80px;
    transform: none;
  }

  .banner:not(.simple) nav.container {
    position: absolute !important;
    top: 1.9rem !important;
    right: 1.7rem !important;
    align-self: auto !important;
    margin: 0 !important;
    padding-top: 0.2rem !important;
    transform: none !important;
  }

  .banner:not(.simple) .company > a.button[href="edit_entry.php"] {
    position: relative !important;
    left: -0.45rem !important;
    top: 0.2rem !important;
  }
}

/* Alternance des deux identités avec un léger basculement en profondeur. */
.banner .logo-home-animated {
  display: block;
  width: 182px;
  height: 84px;
  perspective: 520px;
  -webkit-perspective: 520px;
}

.banner .logo-rotator {
  position: relative;
  display: block;
  width: 100%;
  height: 100%;
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
  -webkit-animation: espacest-logo-flip 10s cubic-bezier(0.55, 0.08, 0.35, 0.95) 1 forwards;
  animation: espacest-logo-flip 10s cubic-bezier(0.55, 0.08, 0.35, 0.95) 1 forwards;
  will-change: transform;
}

.banner .logo-face {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -webkit-transform-origin: center center;
  transform-origin: center center;
}

.banner .logo-face-primary {
  -webkit-transform: rotateY(0deg);
  transform: rotateY(0deg);
}

.banner .logo-face-secondary {
  -webkit-transform: rotateY(180deg);
  transform: rotateY(180deg);
}

.banner .logo-home-animated .logo-face img {
  display: block;
  width: auto;
  height: auto;
  margin: 0 !important;
  transform: none !important;
  max-width: 182px;
  max-height: 84px;
}

.banner .logo-home-animated .logo-face-secondary img {
  max-width: 182px;
  max-height: 84px;
}

@-webkit-keyframes espacest-logo-flip {
  0%,
  50% {
    -webkit-transform: rotateY(0deg);
  }

  55%,
  85% {
    -webkit-transform: rotateY(180deg);
  }

  90%,
  100% {
    -webkit-transform: rotateY(360deg);
  }
}

@keyframes espacest-logo-flip {
  0%,
  50% {
    transform: rotateY(0deg);
  }

  55%,
  85% {
    transform: rotateY(180deg);
  }

  90%,
  100% {
    transform: rotateY(360deg);
  }
}

@media (prefers-reduced-motion: reduce) {
  .banner .logo-rotator {
    -webkit-animation: none;
    animation: none;
    -webkit-transform: none;
    transform: none;
  }

  .banner .logo-face-primary {
    -webkit-transform: none;
    transform: none;
  }

  .banner .logo-face-secondary {
    display: none;
  }
}

@media (max-width: 32rem) {
  .banner .logo-home-animated {
    width: min(182px, 90vw);
  }

  .banner .logo-home-animated .logo-face-secondary img {
    max-width: min(182px, 90vw);
    max-height: 84px;
  }
}

.banner:not(.simple) .company {
  align-items: flex-start;
  min-width: 14rem;
  padding: 0.35rem 1rem 0.35rem 0;
  margin-right: 0.5rem;
  font-size: 0.95rem;
  font-weight: 600;
}

.banner:not(.simple) .company > a.button {
  display: inline-flex;
  align-items: center;
  min-height: 2.1rem;
  padding: 4px 25px !important;
  border-radius: 20px !important;
  background-color: #e6ffff !important;
  color: #000000 !important;
  box-shadow: 0 5px 14px rgba(23, 50, 77, 0.30);
  font-size: 16px !important;
  font-weight: 700 !important;
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}

.banner:not(.simple) .company > a.button:hover,
.banner:not(.simple) .company > a.button:focus {
  background-color: #c9eeee !important;
  color: #000000 !important;
  transform: translateY(-1px);
  box-shadow: 0 6px 14px rgba(20, 125, 131, 0.28);
}

.banner nav.container {
  width: auto;
  min-width: 0;
  padding: 0.2rem 0;
  gap: 0.45rem;
}

.banner nav.container > nav {
  gap: 0.45rem;
  padding: 0.15rem 0;
}

.banner nav.container > nav > nav {
  gap: 0.35rem;
  margin: 0;
  padding: 0.25rem;
  border: 1px solid #e5ebf2;
  border-radius: 0.75rem;
  background: #f7f9fc;
}

.banner nav a,
.banner nav.logon input,
.banner nav.logon span {
  min-height: 2.1rem;
  box-sizing: border-box;
  padding: 4px 25px;
  border-radius: 20px;
  color: #000000 !important;
  background-color: #e6ffff !important;
  box-shadow: 0 3px 8px rgba(23, 50, 77, 0.12);
  font-size: 12px;
  font-weight: 700;
  transition: background 0.15s ease, color 0.15s ease, transform 0.15s ease;
}

.banner nav a:hover,
.banner nav a:focus,
.banner nav.logon input:hover {
  background-color: #c9eeee !important;
  color: #000000 !important;
  transform: translateY(-1px);
  box-shadow: 0 7px 16px rgba(23, 50, 77, 0.34);
}

.banner nav a[href="inscription.php"] {
  background-color: #e6ffff !important;
  color: #000000 !important;
}

/* Form buttons in the account area use the same appearance as menu buttons. */
.banner nav.user-nav form input[type="submit"] {
  min-height: 2.1rem;
  box-sizing: border-box;
  padding: 4px 25px 4px 2.15em;
  border: 0;
  border-radius: 20px;
  color: #000000 !important;
  background-color: #e6ffff !important;
  background-repeat: no-repeat;
  background-position: 0.7em center;
  background-size: 1.05em 1.05em;
  box-shadow: 0 5px 14px rgba(23, 50, 77, 0.30);
  font-size: 12px;
  font-weight: 700 !important;
  transition: background 0.15s ease, color 0.15s ease, transform 0.15s ease;
}

.banner nav.user-nav form input[type="submit"]:hover,
.banner nav.user-nav form input[type="submit"]:focus {
  background-color: #c9eeee !important;
  color: #000000 !important;
  transform: translateY(-1px);
  box-shadow: 0 7px 16px rgba(23, 50, 77, 0.34);
}

/* Explicit class for the login/logout form control, which must match the menu. */
.banner nav.user-nav input.account-action {
  min-height: 2.1rem !important;
  box-sizing: border-box !important;
  padding: 4px 25px 4px 2.15em !important;
  border: 0 !important;
  border-radius: 20px !important;
  color: #000000 !important;
  background-color: #e6ffff !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='8' r='3' fill='none' stroke='%23333' stroke-width='2'/%3E%3Cpath fill='none' stroke='%23333' stroke-width='2' d='M5 20c.7-3.4 3.1-5 7-5s6.3 1.6 7 5'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: 0.7em center !important;
  background-size: 1.05em 1.05em !important;
  box-shadow: 0 5px 14px rgba(23, 50, 77, 0.30) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

.banner nav.user-nav input.account-action:hover,
.banner nav.user-nav input.account-action:focus {
  background-color: #c9eeee !important;
  transform: translateY(-1px);
  box-shadow: 0 7px 16px rgba(23, 50, 77, 0.34) !important;
}

/* Connected user name and logout button use the same pronounced shadow. */
.banner nav.user-nav a.connected-user,
.banner nav.user-nav input.account-action {
  box-shadow: 0 5px 14px rgba(23, 50, 77, 0.30) !important;
}

.banner nav.user-nav a.connected-user:hover,
.banner nav.user-nav a.connected-user:focus,
.banner nav.user-nav input.account-action:hover,
.banner nav.user-nav input.account-action:focus {
  box-shadow: 0 7px 16px rgba(23, 50, 77, 0.34) !important;
}

@media (max-width: 58rem) {
  .banner nav.user-nav a.menu-home.admin-home {
    display: inline-flex !important;
  }

  .banner:not(.simple) {
    align-items: flex-start;
    flex-wrap: wrap;
    padding: 0.65rem 1rem;
  }

  .banner:not(.simple) .company {
    min-width: 0;
    flex: 1 1 12rem;
  }

  .banner nav.container {
    width: 100%;
    flex-basis: 100%;
    align-items: stretch;
  }

  .banner nav.container > nav,
  .banner nav.container > nav > nav {
    justify-content: center;
    flex-wrap: wrap;
  }
}

/* Typographie des quotas légèrement réduite pour rester cohérente avec le site. */
.quota-page {
  font-size: 0.85rem !important;
}

.quota-page h2 {
  font-size: 1.1rem !important;
}

.quota-page h3,
.quota-page .quota-help-title {
  font-size: 0.9rem !important;
}

.quota-page label,
.quota-page input,
.quota-page select,
.quota-page button,
.quota-page .quota-edit-card,
.quota-page .quota-edit-card p {
  font-size: 0.85rem !important;
}

.quota-page .quota-help {
  font-size: 0.78rem !important;
}

/* Accueil reprend exactement le gabarit des autres boutons du menu. */
.banner nav.menu a.menu-home,
.banner nav.user-nav a.menu-home {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 1.6rem !important;
  min-height: 1.6rem !important;
  max-height: 1.6rem !important;
  box-sizing: border-box !important;
  padding: 3px 20px !important;
  margin: 0 !important;
  border-radius: 20px !important;
  font-size: 0.7rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

.banner nav.menu a.menu-home,
.banner nav.user-nav a.menu-home {
  color: #1F2937 !important;
  background: #F3F4F6 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%231F2937' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M3 10.5 12 3l9 7.5M5.5 9v11h13V9M9 20v-6h6v6'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: 0.65em center !important;
  background-size: 1em 1em !important;
  padding-left: 2em !important;
  box-shadow: 0 7px 16px rgba(107, 114, 128, 0.36) !important;
}

.banner nav.menu a.menu-home:hover,
.banner nav.menu a.menu-home:focus,
.banner nav.user-nav a.menu-home:hover,
.banner nav.user-nav a.menu-home:focus {
  color: #1F2937 !important;
  background: #E5E7EB !important;
  box-shadow: 0 9px 20px rgba(107, 114, 128, 0.45) !important;
}

/* Police légèrement agrandie pour toute la navigation et les contrôles du compte. */
.banner nav.menu a,
.banner nav.quick-links a,
.banner nav.user-nav a,
.banner nav.user-nav input,
.banner nav.user-nav span {
  font-size: 0.8rem !important;
}

/* Le bouton Quota reçoit un fond jaune clair en conservant son rendu. */
.banner nav.user-nav > span.quota-status,
.banner nav.user-nav > span.quota-status:hover,
.banner nav.user-nav > span.quota-status:focus {
  background-color: #FEF3C7 !important;
  color: #1F2937 !important;
}

.banner nav.user-nav > span.quota-status .quota-label,
.banner nav.user-nav > span.quota-status .quota-value {
  background: transparent !important;
}

.banner .outstanding a {
  color: #FFF36C;
}


/* ------------ HELP.PHP ------------------------*/

table.details {
  border-spacing: 0;
  border-collapse: collapse;
  margin-bottom: 1.5em;
}

table.details:first-child {
  margin-bottom: 0;
}

table.details.has_caption {
  margin-left: 2em;
}

.details caption {
  text-align: left;
  font-weight: bold;
  margin-left: -2em;
  margin-bottom: 0.2em;
}

.details td {
  padding: 0 1.0em 0 0;
}

.details td:first-child {
  text-align: right;
  white-space: nowrap;
}


/* ------------ IMPORT.PHP ------------------------*/

div.problem_report {
  border-bottom: 1px solid #C3CCD3;
  margin-top: 1em;
}


/* ------------ MINCALS.PHP ---------------------*/

table.minicalendar {
  border-spacing: 0;
  border-collapse: collapse;
}

.minicalendar th {
  min-width: 2.0em;
  text-align: center;
  font-weight: normal;
  background-color: transparent;
}

.minicalendar thead tr:first-child th {
  text-align: center;
  vertical-align: middle;
  line-height: 1.5em;
}

.minicalendar thead tr:first-child th:first-child {
  text-align: left;
}

.minicalendar thead tr:first-child th:last-child {
  text-align: right;
}

.minicalendar td {
  text-align: center;
  font-size: x-small;
}

.minicalendar a.arrow {
  display: block;
  width: 100%;
  height: 100%;
  text-align: center;
}

.minicalendar td > * {
  display: block;
  width: 2em;
  height: 2em;
  line-height: 2em;
  margin: auto;
  border-radius: 50%;
}

.minicalendar td.today a,
.minicalendar td a:hover {
  background-color: #bdd4de;
  color: #0B263B}

.minicalendar .view {
  background-color: #2b3a42;
}

.minicalendar .hidden {
  opacity: 0.7
}

.minicalendar a.current {
  font-weight: bold;
  color: #ff0066;
}


/* ------------ PENDING.PHP ------------------*/

#pending_list form {
  display: inline-block;
}

#pending_list td.table_container, #pending_list td.sub_table {
  padding: 0;
  border: 0;
  margin: 0;
}

#pending_list .control {
  padding-left: 0;
  padding-right: 0;
  text-align: center;
  color: #0B263B;
}

.js #pending_list td.control {
  background-color: #FFF36C;
}

#pending_list td:first-child {
  width: 1.2em;
}

#pending_list #pending_table td.sub_table {
  width: auto;
}

table.admin_table.sub {
  border-right-width: 0;
}

table.sub th {
  background-color: #788D9C;
}

.js .admin_table table.sub th:first-child {
  background-color: #FFF36C;
  border-left-color: #C3CCD3;
}

#pending_list form {
  margin: 2px 4px;
}


/* ------------ REPORT.PHP ----------------------*/

div#div_summary {
  padding-top: 3em;
}

#div_summary table {
  border-spacing: 1px;
  border-collapse: collapse;
  border-color: #0B263B;
  border-style: solid;
  border-top-width: 1px;
  border-right-width: 0;
  border-bottom-width: 0;
  border-left-width: 1px;
}

#div_summary td, #div_summary th {
  padding: 0.1em 0.2em 0.1em 0.2em;
  border-color: #0B263B;
  border-style: solid;
  border-top-width: 0;
  border-right-width: 1px;
  border-bottom-width: 1px;
  border-left-width: 0;
}

#div_summary th {
  background-color: transparent;
  font-weight: bold;
  text-align: center;
}

#div_summary thead tr:nth-child(2) th {
  font-weight: normal;
  font-style: italic;
}

#div_summary th:first-child {
  text-align: right;
}

#div_summary tfoot th {
  text-align: right;
}

#div_summary td {
  text-align: right;
}

#div_summary tbody td:nth-child(even),
#div_summary tfoot th:nth-child(even) {
  border-right-width: 0;
}

#div_summary td:first-child {
  font-weight: bold;
}

p.report_entries {
  float: left;
  clear: left;
  font-weight: bold
}

button#delete_button {
  float: left;
  clear: left;
  margin: 1em 0 3em 0;
}


/* ------------ SEARCH.PHP ----------------------*/

h3.search_results {
  clear: left;
  margin-bottom: 0;
  padding-top: 2em;
}

.search p.error {
  clear: left;
}

p#nothing_found {
  font-weight: bold;
}

div#record_numbers {
  font-weight: bold;
}

div#record_nav {
  float: left;
  margin: 0.5em 0;
}

div#record_nav form {
  float: left;
}

div#record_nav form:first-child {
  margin-right: 1em;
}


/* ------------ SITE_FAQ ------------------------*/

.help q {
  font-style: italic;
}

.help dfn {
  font-style: normal;
  font-weight: bold;
}

#site_faq_contents li a {
  text-decoration: underline;
}

div#site_faq_body {
  margin-top: 2.0em;
}

#site_faq_body h4 {
  border-top: 1px solid #C3CCD3;
  padding-top: 0.5em;
  margin-top: 0;
}

#site_faq_body div {
  padding-bottom: 0.5em;
}

#site_faq_body :target {
  background-color: #ffe6f0;
}


/* ------------ VIEW_ENTRY.PHP ------------------*/

.view_entry #entry td:first-child,
.view_entry #registration .list td:first-child {
  text-align: right;
  font-weight: bold;
  padding-right: 1.0em;
}

.view_entry #registration .list {
  margin-bottom: 1em;
}

.view_entry #entry,
.view_entry #registration {
  padding-left: 1em;
}

.view_entry #registration {
  margin-bottom: 2em;
}

.view_entry #registration p {
  margin-top: 0;
  margin-bottom: 0;
}

.view_entry #registration .standard {
  display: inline-block;
  float: none;
  margin-top: 0;
}

.view_entry #registration .standard fieldset {
  padding-top: 0;
  padding-bottom: 0;
}

.view_entry #registration .standard fieldset > div > label {
  padding-left: 0;
}

.view_entry #registrant_list {
  padding-left: 1em;
}

.view_entry #registrants thead th {
  text-align: left;
}

.view_entry #registrants th,
.view_entry #registrants td {
  vertical-align: middle;
  padding: 0.4em 0.8em;
}

.view_entry #registrants td:not(:first-child) {
  width: 33%;
}

.view_entry h4 {
  margin-top: 2em;
  margin-bottom: 1em;
  clear: left;
}

.view_entry div#view_entry_nav {
  display: table;
  margin-top: 1em;
  margin-bottom: 1em;
}

div#view_entry_nav > div {
  display: table-row;
}

div#view_entry_nav > div > div {
  display: table-cell;
  padding: 0.5em 1em;
}

#view_entry_nav input[type="submit"] {
  width: 100%;
}

.view_entry #approve_buttons form {
  float: left;
  margin-right: 2em;
}

.view_entry #approve_buttons form {
  float: left;
}

div#returl {
  margin-bottom: 1em;
}

#approve_buttons td {
  vertical-align: middle;
  padding-top: 1em;
}

#approve_buttons td#caption {
  text-align: left;
}

#approve_buttons td#note {
  padding-top: 0;
}

#approve_buttons td#note form {
  width: 100%;
}

#approve_buttons td#note textarea {
  width: 100%;
  height: 6em;
  margin-bottom: 0.5em;
}


/*-------------DataTables-------------------------*/

div.datatable_container {
  float: left;
  width: 100%;
}

.js .datatable_container {
  visibility: hidden;
}

div.ColVis_collection {
  float: left;
  width: auto;
}

div.ColVis_collection button.ColVis_Button {
  float: left;
  clear: left;
}

.dataTables_wrapper .dataTables_length {
  clear: both;
}

.dataTables_wrapper .dataTables_filter {
  clear: right;
  margin-bottom: 1em;
}

span.ColVis_radio {
  display: block;
  float: left;
  width: 30px;
}

span.ColVis_title {
  display: block;
  float: left;
  white-space: nowrap;
}

table.dataTable.display tbody tr.odd {
  background-color: #E2E4FF;
}

table.dataTable.display tbody tr.even {
  background-color: white;
}

table.dataTable.display tbody tr.odd > .sorting_1,
table.dataTable.order-column.stripe tbody tr.odd > .sorting_1 {
  background-color: #D3D6FF;
}

table.dataTable.display tbody tr.odd > .sorting_2,
table.dataTable.order-column.stripe tbody tr.odd > .sorting_2 {
  background-color: #DADCFF;
}

table.dataTable.display tbody tr.odd > .sorting_3,
table.dataTable.order-column.stripe tbody tr.odd > .sorting_3 {
  background-color: #E0E2FF;
}

table.dataTable.display tbody tr.even > .sorting_1,
table.dataTable.order-column.stripe tbody tr.even > .sorting_1  {
  background-color: #EAEBFF;
}

table.dataTable.display tbody tr.even > .sorting_2,
table.dataTable.order-column.stripe tbody tr.even > .sorting_2 {
  background-color: #F2F3FF;
}

table.dataTable.display tbody tr.even > .sorting_3,
table.dataTable.order-column.stripe tbody tr.even > .sorting_3 {
  background-color: #F9F9FF;
}

.dataTables_wrapper.no-footer .dataTables_scrollBody {
  border-bottom-width
}

div.dt-buttons {
  float: right;
  margin-bottom: 0.4em;
}

a.dt-button {
  margin-right: 0;
}


/* ------------ jQuery UI additions -------------*/

.ui-autocomplete {
  max-height: 150px;
  overflow-y: auto;
  /* prevent horizontal scrollbar */
  overflow-x: hidden;
  /* add padding to account for vertical scrollbar */
  padding-right: 20px;
}

#check_tabs {border:0}
div#check_tabs {background-image: none}
.edit_entry #ui-tab-dialog-close {position:absolute; right:0; top:23px}
.edit_entry #ui-tab-dialog-close a {float:none; padding:0}



.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange,
.flatpickr-day.selected.inRange,
.flatpickr-day.startRange.inRange,
.flatpickr-day.endRange.inRange,
.flatpickr-day.selected:focus,
.flatpickr-day.startRange:focus,
.flatpickr-day.endRange:focus,
.flatpickr-day.selected:hover,
.flatpickr-day.startRange:hover,
.flatpickr-day.endRange:hover,
.flatpickr-day.selected.prevMonthDay,
.flatpickr-day.startRange.prevMonthDay,
.flatpickr-day.endRange.prevMonthDay,
.flatpickr-day.selected.nextMonthDay,
.flatpickr-day.startRange.nextMonthDay,
.flatpickr-day.endRange.nextMonthDay {
  background: #ffffff;
  border-color: #ffffff;
}

.flatpickr-day.selected.startRange + .endRange,
.flatpickr-day.startRange.startRange + .endRange,
.flatpickr-day.endRange.startRange + .endRange {
  -webkit-box-shadow: -10px 0 0 #ffffff;
  box-shadow: -10px 0 0 #ffffff;
}

.flatpickr-day.week.selected {
  -webkit-box-shadow:-5px 0 0 #ffffff, 5px 0 0 #ffffff;
  box-shadow:-5px 0 0 #ffffff, 5px 0 0 #ffffff;
}

.flatpickr-day.mrbs-hidden {
  color: rgba(57,57,57,0.1);
}

.flatpickr-calendar, .flatpickr-days {
    width: auto !important;
}

h2.date.loading,
h2.date.loading::after {
  animation-name: pulsate;
  animation-duration: 2s;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
}

.ajax-loading input.select2-search__field {
  background-image: url(../images/ajax-loader.gif);
  background-position: center right 5px;
  background-repeat: no-repeat;
}

div.eye {
  height: 1em;
}

.eye svg {
  position: relative;
  height: 1em;
  margin-left: -3em;
}

.eye.off svg {
  display: none;
}

/* Final common appearance: every button matches the main menu buttons. */
input[type="submit"],
input[type="button"],
input[type="reset"],
input[type="image"],
button,
a.button,
a.dt-button,
.ui-button {
  min-height: 2.1rem !important;
  box-sizing: border-box !important;
  padding: 4px 25px !important;
  border: 0 !important;
  border-radius: 20px !important;
  color: #000000 !important;
  background-color: #e6ffff !important;
  box-shadow: 0 3px 8px rgba(23, 50, 77, 0.12) !important;
  font-family: inherit !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1.4em !important;
  transition: background-color 0.15s ease, color 0.15s ease, transform 0.15s ease;
}

input[type="submit"] {
  padding-left: 2.15em !important;
}

.site-credit {
  padding: 0.4rem 1rem 0.65rem;
  color: #929EAC;
  font-size: 0.68rem;
  font-weight: 400;
  line-height: 1.4;
  text-align: center;
  letter-spacing: 0.01em;
}

@media (max-width: 44rem) {
  .site-credit {
    padding-inline: 0.75rem;
    font-size: 0.64rem;
  }
}

.banner nav.user-nav {
  margin-left: auto !important;
  padding-left: 0 !important;
  justify-content: flex-end !important;
}

/* Do not reserve space for empty menu groups before the login button. */
.banner nav.menu:empty,
.banner nav.quick-links:empty {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.banner nav.menu:not(:has(a)),
.banner nav.quick-links:not(:has(a)),
.banner nav.primary-nav:not(:has(a)) {
  display: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

.mobile-booking-popup {
  position: fixed;
  z-index: 10000;
  left: 1rem;
  right: 1rem;
  bottom: 1rem;
  padding: 1rem;
  border: 1px solid #3C8CCC;
  border-radius: 14px;
  background: #FFFFFF;
  color: #17324D;
  box-shadow: 0 10px 28px rgba(23, 50, 77, 0.28);
}

.mobile-booking-details {
  white-space: pre-line;
  line-height: 1.5;
}

.mobile-booking-open {
  display: inline-block;
  margin-top: 0.8rem;
  padding: 0.45rem 0.8rem;
  border-radius: 20px;
  background: #EAF4FC;
  color: #17324D !important;
  font-weight: 700;
  text-decoration: none;
}

/* Keep every button label readable on the light menu background. */
input[type="submit"],
input[type="button"],
input[type="reset"],
button,
nav.menu a,
nav.quick-links a,
a.button,
a.dt-button,
.ui-button,
.ui-button .ui-button-text {
  color: #000000 !important;
  -webkit-text-fill-color: #000000 !important;
}

input[type="submit"]:hover,
input[type="submit"]:focus,
input[type="button"]:hover,
input[type="button"]:focus,
input[type="reset"]:hover,
input[type="reset"]:focus,
input[type="image"]:hover,
input[type="image"]:focus,
button:hover,
button:focus,
a.button:hover,
a.button:focus,
a.dt-button:hover,
a.dt-button:focus,
.ui-button:hover,
.ui-button:focus {
  background-color: #c9eeee !important;
  color: #000000 !important;
  transform: translateY(-1px);
  box-shadow: 0 5px 12px rgba(23, 50, 77, 0.2) !important;
}

/* User names in the users list remain normal text links, not menu buttons. */
#users_table input.user-name-link,
#users_table input.link[type="submit"] {
  min-height: 0 !important;
  box-sizing: content-box !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  color: #0B263B !important;
  background: none !important;
  box-shadow: none !important;
  font-family: inherit !important;
  font-size: inherit !important;
  font-weight: normal !important;
  line-height: normal !important;
  text-align: left;
  transform: none !important;
}

#users_table input.user-name-link:hover,
#users_table input.user-name-link:focus,
#users_table input.link[type="submit"]:hover,
#users_table input.link[type="submit"]:focus {
  color: #0B263B !important;
  background: none !important;
  box-shadow: none !important;
  transform: none !important;
}

/* Les comptes administrateurs sont identifiés en rouge dans la liste. */
#users_table tbody tr.user-admin-row td:first-child,
#users_table tbody tr.user-admin-row td:nth-child(2),
#users_table tbody tr.user-admin-row td:nth-child(3),
#users_table tbody tr.user-admin-row td:first-child .normal,
#users_table tbody tr.user-admin-row td:nth-child(2) .normal {
  color: #B91C1C !important;
  font-weight: 700;
}

#users_table .admin-user-name {
  color: #B91C1C !important;
  font-weight: 700 !important;
}

/* Distinguish the currently connected user's account control. */
#show_my_entries input[type="submit"] {
  background-color: #DCFCE7 !important;
  color: #14532D !important;
}

#show_my_entries input[type="submit"]:hover,
#show_my_entries input[type="submit"]:focus {
  background-color: #BBF7D0 !important;
  color: #14532D !important;
}

/* Primary action: adding a reservation is intentionally highlighted. */
.banner .company > a.button[href="edit_entry.php"] {
  min-height: 2.1rem !important;
  padding: 4px 25px 4px 2.15em !important;
  border-radius: 20px !important;
  color: #FFFFFF !important;
  background-color: #0F766E !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2.5' d='M12 5v14M5 12h14'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: 0.7em center !important;
  background-size: 1.05em 1.05em !important;
  box-shadow: 0 4px 10px rgba(15, 118, 110, 0.28) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

.banner .company > a.button[href="edit_entry.php"]:hover,
.banner .company > a.button[href="edit_entry.php"]:focus {
  color: #FFFFFF !important;
  background-color: #115E59 !important;
  box-shadow: 0 6px 14px rgba(15, 118, 110, 0.4) !important;
}

/* Logo palette: blue, magenta and turquoise. */
.banner nav.menu a.menu-item,
.banner nav.quick-links a.quick-calendar {
  background-color: #D7ECFA !important;
  color: #17324D !important;
}

.banner nav.menu a.menu-item:hover,
.banner nav.menu a.menu-item:focus,
.banner nav.quick-links a.quick-calendar:hover,
.banner nav.quick-links a.quick-calendar:focus {
  background-color: #D7ECFA !important;
  color: #17324D !important;
}

.banner nav.quick-links a.quick-access {
  background-color: #E45CD4 !important;
  color: #FFFFFF !important;
  box-shadow: 0 3px 8px rgba(228, 92, 212, 0.28) !important;
}

.banner nav.quick-links a.quick-access:hover,
.banner nav.quick-links a.quick-access:focus {
  background-color: #C94DBA !important;
  color: #FFFFFF !important;
}

#show_my_entries input[type="submit"] {
  background-color: #E7F8F6 !important;
  color: #17665F !important;
  box-shadow: 0 3px 8px rgba(68, 188, 180, 0.28) !important;
}

#show_my_entries input[type="submit"]:hover,
#show_my_entries input[type="submit"]:focus {
  background-color: #C9EFEB !important;
  color: #17665F !important;
}

.banner .company > a.button[href="edit_entry.php"] {
  background-color: #3C8CCC !important;
  box-shadow: 0 4px 10px rgba(60, 140, 204, 0.32) !important;
}

.banner .company > a.button[href="edit_entry.php"]:hover,
.banner .company > a.button[href="edit_entry.php"]:focus {
  background-color: #2E70A8 !important;
  box-shadow: 0 6px 14px rgba(60, 140, 204, 0.42) !important;
}

/* Calendar button style applied consistently to every button. */
input[type="submit"]:not(.user-name-link),
input[type="button"],
input[type="reset"],
input[type="image"],
button,
a.button,
a.dt-button,
.ui-button,
.banner nav.menu a,
.banner nav.quick-links a,
nav.view a,
nav.arrow a {
  color: #17324D !important;
  background-color: #EAF4FC !important;
  box-shadow: 0 3px 8px rgba(60, 140, 204, 0.18) !important;
}

input[type="submit"]:not(.user-name-link):hover,
input[type="submit"]:not(.user-name-link):focus,
input[type="button"]:hover,
input[type="button"]:focus,
input[type="reset"]:hover,
input[type="reset"]:focus,
input[type="image"]:hover,
input[type="image"]:focus,
button:hover,
button:focus,
a.button:hover,
a.button:focus,
a.dt-button:hover,
a.dt-button:focus,
.ui-button:hover,
.ui-button:focus,
.banner nav.menu a:hover,
.banner nav.menu a:focus,
.banner nav.quick-links a:hover,
.banner nav.quick-links a:focus,
nav.view a:hover,
nav.view a:focus,
nav.arrow a:hover,
nav.arrow a:focus {
  color: #17324D !important;
  background-color: #D7ECFA !important;
  box-shadow: 0 5px 12px rgba(60, 140, 204, 0.28) !important;
}

/* Same final style for the account and access buttons. */
.banner nav.quick-links a.quick-access,
.banner nav.quick-links a.quick-calendar,
.banner nav.user-nav input.account-action,
.banner nav.user-nav input[value="Se déconnecter"],
.banner nav.user-nav input[value="Log off"],
.banner nav.user-nav #show_my_entries input[type="submit"] {
  min-height: 2.1rem !important;
  box-sizing: border-box !important;
  padding: 4px 25px !important;
  border: 0 !important;
  border-radius: 20px !important;
  color: #17324D !important;
  background-color: #EAF4FC !important;
  box-shadow: 0 3px 8px rgba(60, 140, 204, 0.18) !important;
  font-family: inherit !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

.banner nav.quick-links a.quick-access:hover,
.banner nav.quick-links a.quick-access:focus,
.banner nav.quick-links a.quick-calendar:hover,
.banner nav.quick-links a.quick-calendar:focus,
.banner nav.user-nav input.account-action:hover,
.banner nav.user-nav input.account-action:focus,
.banner nav.user-nav input[value="Se déconnecter"]:hover,
.banner nav.user-nav input[value="Se déconnecter"]:focus,
.banner nav.user-nav input[value="Log off"]:hover,
.banner nav.user-nav input[value="Log off"]:focus,
.banner nav.user-nav #show_my_entries input[type="submit"]:hover,
.banner nav.user-nav #show_my_entries input[type="submit"]:focus {
  color: #17324D !important;
  background-color: #D7ECFA !important;
  box-shadow: 0 5px 12px rgba(60, 140, 204, 0.28) !important;
}

/* Final corrections for the account controls and primary reservation action. */
.banner nav.user-nav input[value="Se déconnecter"],
.banner nav.user-nav input[value="Log off"] {
  color: #17324D !important;
  background-color: #EAF4FC !important;
  background-image: none !important;
  box-shadow: 0 3px 8px rgba(60, 140, 204, 0.18) !important;
}

.banner nav.user-nav input[value="Se déconnecter"]:hover,
.banner nav.user-nav input[value="Se déconnecter"]:focus,
.banner nav.user-nav input[value="Log off"]:hover,
.banner nav.user-nav input[value="Log off"]:focus {
  color: #17324D !important;
  background-color: #D7ECFA !important;
}

/* Connected username: dark-gray account accent. */
#show_my_entries input[type="submit"] {
  color: #FFFFFF !important;
  background-color: #374151 !important;
  box-shadow: 0 4px 10px rgba(55, 65, 81, 0.28) !important;
}

#show_my_entries input[type="submit"]:hover,
#show_my_entries input[type="submit"]:focus {
  color: #FFFFFF !important;
  background-color: #1F2937 !important;
  box-shadow: 0 6px 14px rgba(31, 41, 55, 0.38) !important;
}

/* Last override: keep the connected-user button dark gray. */
nav.user-nav form#show_my_entries input[type="submit"],
nav.user-nav input.account-action.connected-user {
  color: #1F2937 !important;
  background-color: #D1D5DB !important;
  box-shadow: 0 4px 10px rgba(107, 114, 128, 0.28) !important;
}

nav.user-nav form#show_my_entries input[type="submit"]:hover,
nav.user-nav form#show_my_entries input[type="submit"]:focus,
nav.user-nav input.account-action.connected-user:hover,
nav.user-nav input.account-action.connected-user:focus {
  color: #1F2937 !important;
  background-color: #B8BEC8 !important;
  box-shadow: 0 6px 14px rgba(107, 114, 128, 0.38) !important;
}

nav.user-nav > span.connected-user-name {
  display: inline-block;
  color: #1F2937 !important;
  background-color: #D1D5DB !important;
  border-radius: 20px;
  box-shadow: 0 4px 10px rgba(107, 114, 128, 0.28) !important;
  padding: 2px 25px !important;
  font-weight: 700 !important;
}

nav.user-nav > span.quota-status {
  display: inline-block;
  color: #1F2937 !important;
  background-color: #E7FAF3 !important;
  border-radius: 20px;
  box-shadow: 0 4px 10px rgba(68, 188, 180, 0.28) !important;
  padding: 2px 16px !important;
  font-weight: 700 !important;
  white-space: nowrap;
}

/* Fallback when the connected username is rendered as plain text. */
.banner nav.user-nav > span {
  color: #FFFFFF !important;
  background-color: #374151 !important;
  border-radius: 20px;
  box-shadow: 0 4px 10px rgba(55, 65, 81, 0.28) !important;
  padding: 2px 25px !important;
  font-weight: 700 !important;
}

.banner .company > a.button[href="edit_entry.php"] {
  color: #FFFFFF !important;
  background-color: #44BCB4 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23fff' stroke-width='2.5' d='M12 5v14M5 12h14'/%3E%3C/svg%3E") !important;
  box-shadow: 0 4px 10px rgba(68, 188, 180, 0.32) !important;
}

.banner .company > a.button[href="edit_entry.php"]:hover,
.banner .company > a.button[href="edit_entry.php"]:focus {
  color: #FFFFFF !important;
  background-color: #2F9993 !important;
  box-shadow: 0 6px 14px rgba(68, 188, 180, 0.42) !important;
}

/* Primary reservation action uses the former dark-green account color. */
.banner .company > a.button[href="edit_entry.php"] {
  color: #FFFFFF !important;
  background-color: #0F766E !important;
  box-shadow: 0 4px 10px rgba(15, 118, 110, 0.32) !important;
}

.banner .company > a.button[href="edit_entry.php"]:hover,
.banner .company > a.button[href="edit_entry.php"]:focus {
  color: #FFFFFF !important;
  background-color: #115E59 !important;
  box-shadow: 0 6px 14px rgba(15, 118, 110, 0.42) !important;
}

/* Primary reservation action: former light-green account color. */
.banner .company > a.button[href="edit_entry.php"] {
  color: #14532D !important;
  background-color: #E7FAF3 !important;
  border: 2px solid #44BCB4 !important;
  box-sizing: border-box !important;
  box-shadow: 0 5px 14px rgba(68, 188, 180, 0.34) !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

.banner .company > a.button[href="edit_entry.php"]:hover,
.banner .company > a.button[href="edit_entry.php"]:focus {
  color: #14532D !important;
  background-color: #C6F3E5 !important;
  border-color: #2F9993 !important;
  box-shadow: 0 7px 16px rgba(68, 188, 180, 0.45) !important;
}

/* Keep the primary action compact after enlarging the logo. */
.banner .company > a.button[href="edit_entry.php"] {
  min-height: 1.9rem !important;
  padding-top: 2px !important;
  padding-bottom: 2px !important;
  line-height: 1.3em !important;
}

/* Slightly reduce the height of all menu and account controls. */
.banner nav.menu a,
.banner nav.quick-links a,
.banner nav.user-nav input,
.banner nav.user-nav span {
  min-height: 1.75rem !important;
  padding-top: 2px !important;
  padding-bottom: 2px !important;
  line-height: 1.25em !important;
}

/* Connected user: turquoise accent from the logo. */
#show_my_entries input[type="submit"] {
  color: #FFFFFF !important;
  background-color: #44BCB4 !important;
  box-shadow: 0 4px 10px rgba(68, 188, 180, 0.32) !important;
}

#show_my_entries input[type="submit"]:hover,
#show_my_entries input[type="submit"]:focus {
  color: #FFFFFF !important;
  background-color: #2F9993 !important;
  box-shadow: 0 6px 14px rgba(68, 188, 180, 0.42) !important;
}

/* Match the logo depth across the menu and account controls. */
.banner nav.menu a,
.banner nav.quick-links a,
.banner nav.user-nav input,
.banner .company > a.button {
  filter: drop-shadow(0 4px 5px rgba(60, 140, 204, 0.28));
}

/* Final priority for the connected-user button. */
nav.user-nav form#show_my_entries input[type="submit"],
nav.user-nav input.account-action.connected-user {
  color: #1F2937 !important;
  background-color: #F3F4F6 !important;
  box-shadow: 0 4px 10px rgba(107, 114, 128, 0.22) !important;
}

nav.user-nav form#show_my_entries input[type="submit"]:hover,
nav.user-nav form#show_my_entries input[type="submit"]:focus,
nav.user-nav input.account-action.connected-user:hover,
nav.user-nav input.account-action.connected-user:focus {
  color: #1F2937 !important;
  background-color: #E5E7EB !important;
  box-shadow: 0 6px 14px rgba(107, 114, 128, 0.3) !important;
}

/* Calendar/table navigation uses the same menu-button appearance. */
nav.view a,
nav.arrow a {
  min-height: 1.75rem !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 2px 14px !important;
  border: 0 !important;
  border-radius: 20px !important;
  color: #17324D !important;
  background: #EAF4FC !important;
  box-shadow: 0 3px 8px rgba(60, 140, 204, 0.18) !important;
  font-weight: 700 !important;
  text-decoration: none !important;
}

nav.view a:hover,
nav.view a:focus,
nav.arrow a:hover,
nav.arrow a:focus,
nav.view a.selected {
  color: #17324D !important;
  background: #D7ECFA !important;
  box-shadow: 0 5px 12px rgba(60, 140, 204, 0.28) !important;
}

nav.view a:active,
nav.arrow a:active,
nav.view a.selected {
  color: #14532D !important;
  background: #D5F2E6 !important;
  box-shadow: 0 5px 14px rgba(68, 188, 180, 0.34) !important;
}

nav.view div.container,
nav.arrow {
  gap: 6px !important;
}

/* There is one shared room: keep its form control functional but hide it. */
#div_rooms {
  display: none !important;
}

/* The home calendar has one shared room, so hide only its room selector. */
.location .roomChangeForm {
  display: none !important;
}

/* Calendar buttons match the connected-user button exactly. */
nav.view a,
nav.arrow a {
  color: #1F2937 !important;
  background: #F3F4F6 !important;
  box-shadow: 0 7px 16px rgba(107, 114, 128, 0.36) !important;
}

nav.view a:hover,
nav.view a:focus,
nav.arrow a:hover,
nav.arrow a:focus,
nav.view a:active,
nav.arrow a:active,
nav.view a.selected {
  color: #1F2937 !important;
  background: #E5E7EB !important;
  box-shadow: 0 9px 20px rgba(107, 114, 128, 0.45) !important;
}

/* The complete menu matches the connected-user button. */
.banner nav.menu a,
.banner nav.quick-links a {
  color: #1F2937 !important;
  background: #F3F4F6 !important;
  box-shadow: 0 7px 16px rgba(107, 114, 128, 0.36) !important;
}

.banner nav.menu a:hover,
.banner nav.menu a:focus,
.banner nav.quick-links a:hover,
.banner nav.quick-links a:focus,
.banner nav.menu a:active,
.banner nav.quick-links a:active {
  color: #1F2937 !important;
  background: #E5E7EB !important;
  box-shadow: 0 9px 20px rgba(107, 114, 128, 0.45) !important;
}

/* Override the more specific menu color rules. */
.banner nav.menu a.menu-item,
.banner nav.quick-links a.quick-access,
.banner nav.quick-links a.quick-calendar {
  color: #1F2937 !important;
  background-color: #F3F4F6 !important;
  box-shadow: 0 7px 16px rgba(107, 114, 128, 0.36) !important;
}

.banner nav.menu a.menu-item:hover,
.banner nav.menu a.menu-item:focus,
.banner nav.quick-links a.quick-access:hover,
.banner nav.quick-links a.quick-access:focus,
.banner nav.quick-links a.quick-calendar:hover,
.banner nav.quick-links a.quick-calendar:focus {
  color: #1F2937 !important;
  background-color: #E5E7EB !important;
  box-shadow: 0 9px 20px rgba(107, 114, 128, 0.45) !important;
}

/* Invert the account accents: dark blue for the user, light gray for logout. */
nav.user-nav form#show_my_entries input[type="submit"],
nav.user-nav input.account-action.connected-user,
nav.user-nav > span.connected-user-name {
  color: #17324D !important;
  background-color: #FFFFFF !important;
  box-shadow: 0 7px 16px rgba(60, 140, 204, 0.36) !important;
}

nav.user-nav form#show_my_entries input[type="submit"]:hover,
nav.user-nav form#show_my_entries input[type="submit"]:focus,
nav.user-nav input.account-action.connected-user:hover,
nav.user-nav input.account-action.connected-user:focus {
  color: #17324D !important;
  background-color: #D7ECFA !important;
  box-shadow: 0 9px 20px rgba(60, 140, 204, 0.45) !important;
}

nav.user-nav input[value="Se déconnecter"],
nav.user-nav input[value="Log off"] {
  color: #1F2937 !important;
  background-color: #F3F4F6 !important;
  box-shadow: 0 7px 16px rgba(107, 114, 128, 0.36) !important;
}

nav.user-nav input[value="Se déconnecter"]:hover,
nav.user-nav input[value="Se déconnecter"]:focus,
nav.user-nav input[value="Log off"]:hover,
nav.user-nav input[value="Log off"]:focus {
  color: #1F2937 !important;
  background-color: #E5E7EB !important;
  box-shadow: 0 9px 20px rgba(107, 114, 128, 0.45) !important;
}

/* All form action buttons share the calendar-button appearance. */
form:not(#show_my_entries) input[type="submit"],
form:not(#show_my_entries) input[type="button"],
form:not(#show_my_entries) input[type="reset"],
form:not(#show_my_entries) button,
form:not(#show_my_entries) a.button {
  min-height: 1.75rem !important;
  box-sizing: border-box !important;
  border: 0 !important;
  border-radius: 20px !important;
  color: #1F2937 !important;
  background-color: #F3F4F6 !important;
  box-shadow: 0 7px 16px rgba(107, 114, 128, 0.36) !important;
  font-weight: 700 !important;
}

form:not(#show_my_entries) input[type="submit"]:hover,
form:not(#show_my_entries) input[type="submit"]:focus,
form:not(#show_my_entries) input[type="button"]:hover,
form:not(#show_my_entries) input[type="button"]:focus,
form:not(#show_my_entries) input[type="reset"]:hover,
form:not(#show_my_entries) input[type="reset"]:focus,
form:not(#show_my_entries) button:hover,
form:not(#show_my_entries) button:focus,
form:not(#show_my_entries) a.button:hover,
form:not(#show_my_entries) a.button:focus,
form:not(#show_my_entries) input[type="submit"]:active,
form:not(#show_my_entries) input[type="button"]:active,
form:not(#show_my_entries) input[type="reset"]:active,
form:not(#show_my_entries) button:active,
form:not(#show_my_entries) a.button:active {
  color: #1F2937 !important;
  background-color: #E5E7EB !important;
  box-shadow: 0 9px 20px rgba(107, 114, 128, 0.45) !important;
}

/* Give the booking creator field enough room for a full display name. */
#main select[name="create_by"],
#main input[name="create_by"] {
  min-width: 14rem !important;
}

/* Restore the menu icons after the button background harmonisation. */
.banner nav.menu a.menu-kiosk {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='4' y='5' width='16' height='14' rx='2' fill='none' stroke='%23333' stroke-width='2'/%3E%3Cpath fill='none' stroke='%23333' stroke-width='2' d='M8 9h8M8 13h5'/%3E%3C/svg%3E") !important;
}

.banner nav.menu a.menu-rooms {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23333' stroke-width='2' d='M4 20V5h16v15M8 9h2m4 0h2M8 13h2m4 0h2M8 20v-3h3v3m2-11h3'/%3E%3C/svg%3E") !important;
}

.banner nav.menu a.menu-user_list {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='8' r='3' fill='none' stroke='%23333' stroke-width='2'/%3E%3Cpath fill='none' stroke='%23333' stroke-width='2' d='M5 20c.7-3.4 3.1-5 7-5s6.3 1.6 7 5'/%3E%3C/svg%3E") !important;
}

.banner nav.quick-links a.quick-access {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23333' stroke-width='2' d='M12 5v14M5 12h14'/%3E%3C/svg%3E") !important;
}

.banner nav.quick-links a.quick-calendar {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='4' y='5' width='16' height='15' rx='2' fill='none' stroke='%23333' stroke-width='2'/%3E%3Cpath fill='none' stroke='%23333' stroke-width='2' d='M8 3v4m8-4v4M4 10h16'/%3E%3C/svg%3E") !important;
}

.banner nav.menu a.menu-item,
.banner nav.quick-links a.quick-access,
.banner nav.quick-links a.quick-calendar {
  background-repeat: no-repeat !important;
  background-position: 0.7em center !important;
  background-size: 1.05em 1.05em !important;
  padding-left: 2.15em !important;
}

/* Compact menu buttons and vertically centered icons. */
.banner nav.menu a,
.banner nav.quick-links a {
  min-height: 1.6rem !important;
  padding-top: 1px !important;
  padding-bottom: 1px !important;
  line-height: 1.15em !important;
}

.banner nav.menu a.menu-item,
.banner nav.quick-links a.quick-access,
.banner nav.quick-links a.quick-calendar {
  background-position: 0.65em center !important;
  background-size: 1em 1em !important;
  padding-left: 2em !important;
}

/* Only the primary reservation action uses the blue accent. */
.banner .company > a.button[href="edit_entry.php"] {
  color: #17324D !important;
  background-color: #E7FAF3 !important;
  margin-left: 0.75rem !important;
  min-height: 2.4rem !important;
  padding: 8px 36px !important;
  border: 0 !important;
  box-shadow: 0 7px 16px rgba(68, 188, 180, 0.36) !important;
}

.banner .company > a.button[href="edit_entry.php"]:hover,
.banner .company > a.button[href="edit_entry.php"]:focus {
  color: #17324D !important;
  background-color: #C6F3E5 !important;
  border: 0 !important;
  box-shadow: 0 9px 20px rgba(68, 188, 180, 0.45) !important;
}

/* Password reset page: clearer reading width and form controls. */
body.reset_password .contents {
  max-width: 42rem;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1rem;
  padding-right: 1rem;
}

body.reset_password form#lost_password {
  max-width: 38rem;
  margin: 1.5rem auto 2rem;
}

body.reset_password form#lost_password p {
  float: none;
  clear: none;
  line-height: 1.55;
  font: inherit;
  color: inherit;
}

body.reset_password form#lost_password input[type="text"],
body.reset_password form#lost_password input[type="password"],
body.reset_password form#lost_password select {
  box-sizing: border-box;
  max-width: 100%;
}

body.reset_password form#lost_password label {
  white-space: nowrap;
}

/* Quota: same pill shape and depth as the menu buttons, with red text. */
nav.user-nav > span.quota-status {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  height: 1.75rem !important;
  box-sizing: border-box;
  padding: 2px 25px 2px 2.1em !important;
  border-radius: 20px !important;
  background-color: #FFFFFF !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23B91C1C' stroke-width='2' stroke-linecap='round' d='M6 3h12M6 21h12M7 3c0 5 10 5 10 9s-10 4-10 9M17 3c0 5-10 5-10 9s10 4 10 9'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: 0.7em center !important;
  background-size: 1em 1em !important;
  box-shadow: 0 4px 10px rgba(60, 140, 204, 0.28) !important;
  filter: drop-shadow(0 4px 5px rgba(60, 140, 204, 0.28));
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.25em !important;
  text-align: center !important;
}

nav.user-nav > span.quota-status .quota-label {
  display: inline !important;
  min-height: 0 !important;
  color: #1F2937 !important;
  background: transparent !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

nav.user-nav > span.quota-status .quota-value {
  display: inline !important;
  margin-left: 0.2rem !important;
  min-height: 0 !important;
  color: #B91C1C !important;
  background: transparent !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* Group room and user administration under one Parameters button. */
.banner nav.menu details.menu-settings {
  position: relative;
  display: inline-block;
  vertical-align: middle;
}

.banner nav.menu details.menu-settings > summary.menu-settings-toggle {
  list-style: none;
  cursor: pointer;
  display: inline-block;
  box-sizing: border-box;
  min-height: 1.75rem !important;
  padding: 2px 1em 2px 2em !important;
  border-radius: 20px !important;
  background-color: #EAF4FC !important;
  color: #17324D !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  line-height: 1.25em !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23333' stroke-width='2' d='M12 3v3m0 12v3M3 12h3m12 0h3M5.6 5.6l2.1 2.1m8.6 8.6l2.1 2.1m0-12.8l-2.1 2.1m-8.6 8.6l-2.1 2.1M12 8a4 4 0 1 0 0 8 4 4 0 0 0-0-8z'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: 0.7em center !important;
  background-size: 1em 1em !important;
  box-shadow: 0 4px 10px rgba(60, 140, 204, 0.28) !important;
}

.banner nav.menu details.menu-settings > summary.menu-settings-toggle::-webkit-details-marker {
  display: none;
}

.banner nav.menu details.menu-settings > summary.menu-settings-toggle:hover,
.banner nav.menu details.menu-settings > summary.menu-settings-toggle:focus {
  background-color: #D7ECFA !important;
}

.banner nav.menu details.menu-settings .menu-settings-panel {
  position: absolute;
  top: calc(100% + 0.35rem);
  left: 0;
  z-index: 1000;
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  min-width: max-content;
  padding: 0.5rem;
  border-radius: 14px;
  background: #FFFFFF;
  box-shadow: 0 8px 18px rgba(23, 50, 77, 0.22);
}

.banner nav.menu details.menu-settings .menu-settings-panel a {
  white-space: nowrap;
}

/* Keep every main menu button at exactly the same height. */
.banner nav.menu > a,
.banner nav.menu > details.menu-settings > summary,
.banner nav.menu .menu-settings-panel a {
  display: inline-flex !important;
  align-items: center !important;
  height: 1.75rem !important;
  min-height: 0 !important;
  max-height: 1.75rem !important;
  box-sizing: border-box !important;
  line-height: 1 !important;
  vertical-align: middle !important;
  filter: drop-shadow(0 4px 5px rgba(60, 140, 204, 0.28));
}

/* Align the connected-user button height with the menu buttons. */
nav.user-nav > span.quota-status,
nav.user-nav input.account-action.connected-user,
nav.user-nav form#show_my_entries input[type="submit"] {
  height: 1.75rem !important;
  min-height: 0 !important;
  max-height: 1.75rem !important;
  box-sizing: border-box !important;
  padding-top: 2px !important;
  padding-bottom: 2px !important;
  vertical-align: middle !important;
}

/* Navigation réduite à Aujourd'hui et Mois. */
nav.view div.container {
  grid-template-columns: 1fr !important;
}

.settings-page {
  max-width: 52rem;
  margin: 0 auto;
  padding: 1rem;
}

.settings-links {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: center;
  gap: 1rem;
  margin-top: 1.5rem;
}

.settings-link {
  width: 100% !important;
  height: 1.75rem !important;
  min-height: 0 !important;
  max-height: 1.75rem !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  line-height: 1 !important;
}

@media (max-width: 40rem) {
  .settings-links {
    grid-template-columns: 1fr;
  }
}

/* Fond des réservations affichées dans le calendrier. */
.dwm_main .booking_list > div.I,
.dwm_main .booking_list > div.I a {
  background: #9ADFC0 !important;
}

/* Le texte de l'action principale reprend le vert des réservations. */
.banner .company > a.button[href="edit_entry.php"],
.banner .company > a.button[href="edit_entry.php"]:hover,
.banner .company > a.button[href="edit_entry.php"]:focus {
  color: #9ADFC0 !important;
}

/* Dimensions finales des deux boutons concernés. */
.banner nav.user-nav a.account-settings-action {
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  max-height: 1.75rem !important;
  padding-right: 16px !important;
}

.banner .company > a.button[href="edit_entry.php"] {
  height: 2.6rem !important;
  min-height: 2.6rem !important;
  padding-left: 2.35em !important;
  padding-right: 36px !important;
}

/* Priorité finale : formulaires ajoutés alignés sur le formulaire standard. */
.settings-page {
  color: #17324D;
  font-family: inherit;
}

.settings-page h2,
.settings-page h3 {
  color: #17324D;
  font-weight: 700;
}

.quota-selector,
.quota-edit-card {
  box-sizing: border-box;
  padding: 1rem;
  border: 1px solid #CBD5E1;
  border-radius: 8px;
  background: #FFFFFF;
  box-shadow: 0 4px 10px rgba(23, 50, 77, 0.12);
}

.quota-selector {
  margin-top: 1.25rem;
}

.quota-selector > div,
.quota-edit-form {
  gap: 0.75rem;
}

.quota-selector label,
.quota-edit-form label {
  color: #17324D;
  font-weight: 700;
}

.quota-selector input[type="search"],
.quota-selector select,
.quota-edit-form input[type="number"] {
  min-height: 2.1rem;
  border: 1px solid #AAB8C7;
  border-radius: 8px;
  background: #FFFFFF;
  color: #17324D;
  font-family: inherit;
  font-size: 0.95rem;
  padding: 4px 10px;
}

.quota-selector input[type="search"]:focus,
.quota-selector select:focus,
.quota-edit-form input[type="number"]:focus {
  border-color: #3C8CCC;
  outline: 2px solid rgba(60, 140, 204, 0.2);
  outline-offset: 1px;
}

.quota-edit-card {
  margin-top: 1.25rem;
}

.quota-help-title {
  color: #17324D;
  font-weight: 700;
}

.quota-help {
  color: #536579;
}

/* Priorité finale : aucun texte du menu ni du compte en gras. */
.banner nav.menu a,
.banner nav.menu a.menu-item,
.banner nav.menu summary,
.banner nav.menu details.menu-settings > summary.menu-settings-toggle,
.banner nav.quick-links a,
.banner nav.quick-links a.quick-access,
.banner nav.quick-links a.quick-calendar,
.banner nav.user-nav a,
.banner nav.user-nav a.account-settings-action,
.banner nav.user-nav input,
.banner nav.user-nav input.account-action,
.banner nav.user-nav form#show_my_entries input[type="submit"],
.banner nav.user-nav span,
.banner nav.user-nav > span.quota-status,
.banner nav.user-nav > span.connected-user-name,
.banner nav.logon input[type="submit"],
.banner nav.logon input[value="S'identifier"],
.banner nav.logon input[value="Se déconnecter"],
.banner nav.logon input[value="Log off"],
.dwm_main nav.view a,
.dwm_main nav.arrow a,
nav.view a,
nav.arrow a,
.settings-layout .settings-link {
  font-weight: 400 !important;
}

/* Alignement final des boutons Aujourd'hui, Semaine, Jour et Mois. */
nav.view,
nav.arrow {
  display: inline-flex !important;
  align-items: stretch !important;
  vertical-align: middle !important;
}

nav.view a,
nav.arrow a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  box-sizing: border-box !important;
  line-height: 1 !important;
  vertical-align: middle !important;
}

/* Dernière priorité : même fond verre que les réservations du calendrier. */
.banner .company > a.button[href="edit_entry.php"] {
  background-color: #D5F2E6 !important;
  color: #14532D !important;
  box-shadow: 0 5px 14px rgba(68, 188, 180, 0.28) !important;
}

.banner .company > a.button[href="edit_entry.php"]:hover,
.banner .company > a.button[href="edit_entry.php"]:focus {
  background-color: #C6F3E5 !important;
  color: #14532D !important;
}

/* Largeur plus compacte sans modifier la hauteur du bouton. */
.banner .company > a.button[href="edit_entry.php"] {
  padding-left: 1.85em !important;
  padding-right: 8px !important;
}

/* Hauteur identique aux boutons du menu. */
.banner .company > a.button[href="edit_entry.php"] {
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  box-sizing: border-box !important;
  line-height: 1 !important;
}

/* Le bouton principal reprend exactement le verre des réservations du calendrier. */
.banner .company > a.button[href="edit_entry.php"] {
  background-color: #9ADFC0 !important;
  color: #14532D !important;
  box-shadow: 0 5px 14px rgba(68, 188, 180, 0.34) !important;
}

.banner .company > a.button[href="edit_entry.php"]:hover,
.banner .company > a.button[href="edit_entry.php"]:focus {
  background-color: #86D4B1 !important;
  color: #14532D !important;
}

/* Taille et graisse finales pour le menu et Aujourd'hui. */
.banner nav.menu a.menu-item,
.banner nav.menu details.menu-settings > summary.menu-settings-toggle,
.banner nav.quick-links a.quick-access,
.banner nav.quick-links a.quick-calendar,
.banner nav.user-nav a.account-settings-action,
.banner nav.user-nav input.account-action,
.banner nav.user-nav form#show_my_entries input[type="submit"],
.banner nav.user-nav > span.quota-status,
.banner nav.user-nav > span.connected-user-name,
.banner nav.logon input[type="submit"],
nav.arrow a {
  font-size: 0.85rem !important;
  font-weight: 700 !important;
}

/* Priorité finale : menu et Aujourd'hui légèrement plus petits et en gras. */
.banner nav.menu a.menu-item,
.banner nav.menu details.menu-settings > summary.menu-settings-toggle,
.banner nav.quick-links a.quick-access,
.banner nav.quick-links a.quick-calendar,
.banner nav.user-nav a.account-settings-action,
.banner nav.user-nav input.account-action,
.banner nav.user-nav form#show_my_entries input[type="submit"],
.banner nav.user-nav > span.quota-status,
.banner nav.user-nav > span.connected-user-name,
.banner nav.logon input[type="submit"],
nav.arrow a {
  font-size: 0.85rem !important;
  font-weight: 700 !important;
}

/* Priorité finale : menu et Aujourd'hui légèrement plus petits et en gras. */
.banner nav.menu a.menu-item,
.banner nav.menu details.menu-settings > summary.menu-settings-toggle,
.banner nav.quick-links a.quick-access,
.banner nav.quick-links a.quick-calendar,
.banner nav.user-nav a.account-settings-action,
.banner nav.user-nav input.account-action,
.banner nav.user-nav form#show_my_entries input[type="submit"],
.banner nav.user-nav > span.quota-status,
.banner nav.user-nav > span.connected-user-name,
.banner nav.logon input[type="submit"],
nav.arrow a {
  font-size: 0.85rem !important;
  font-weight: 700 !important;
}

/* Menu et bouton Aujourd'hui : texte légèrement réduit et en gras. */
.banner nav.menu a,
.banner nav.menu summary,
.banner nav.quick-links a,
.banner nav.user-nav a,
.banner nav.user-nav input,
.banner nav.user-nav span,
nav.arrow a {
  font-size: 0.85rem !important;
  font-weight: 700 !important;
}

/* Alignement uniforme des boutons de navigation du calendrier. */
nav.view,
nav.arrow {
  display: inline-flex !important;
  align-items: stretch !important;
  vertical-align: middle !important;
}

nav.view a,
nav.arrow a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 1.75rem !important;
  box-sizing: border-box !important;
  line-height: 1 !important;
  vertical-align: middle !important;
}

/* Page Paramètres : actions à gauche, résumé global à droite. */
.settings-layout {
  display: grid;
  grid-template-columns: minmax(14rem, 0.85fr) minmax(20rem, 1.15fr);
  align-items: start;
  gap: 1.5rem;
  margin-top: 1.25rem;
}

.settings-layout .settings-links {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 0.75rem;
  margin-top: 0;
}

.settings-layout .settings-link {
  width: 100% !important;
}

.settings-summary {
  box-sizing: border-box;
  padding: 1.25rem;
  border: 1px solid #CBD5E1;
  border-radius: 8px;
  background: #FFFFFF;
  color: #17324D;
  box-shadow: 0 4px 10px rgba(23, 50, 77, 0.12);
}

.settings-summary h3,
.settings-summary h4 {
  margin-top: 0;
  color: #17324D;
  font-weight: 700;
}

.settings-stats {
  display: grid;
  gap: 0.65rem;
  margin: 0;
}

.settings-stats > div {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding-bottom: 0.55rem;
  border-bottom: 1px solid #E2E8F0;
}

.settings-stats dt {
  font-weight: 700;
}

.settings-stats dd {
  margin: 0;
  color: #0F766E;
  font-size: 1.1rem;
  font-weight: 700;
}

.settings-latest-booking {
  margin-top: 1.25rem;
  padding-top: 1rem;
  border-top: 1px solid #E2E8F0;
}

.settings-latest-booking p {
  margin: 0.4rem 0;
}

.settings-latest-booking .settings-booking-title {
  color: #0F766E;
  font-size: 1.05rem;
  font-weight: 700;
}

@media (max-width: 40rem) {
  .settings-layout {
    grid-template-columns: 1fr;
    gap: 1rem;
  }
}

/* Finition harmonisée avec les formulaires standards du site. */
.settings-summary {
  padding: 1rem;
  border: 1px solid #CBD5E1;
  border-radius: 8px;
  background: #F8FAFC;
  color: #17324D;
  font-size: 0.9rem;
  line-height: 1.45;
  box-shadow: 0 4px 10px rgba(23, 50, 77, 0.12);
}

.settings-summary h3 {
  margin: 0 0 0.85rem;
  font-size: 1rem;
}

.settings-summary h4 {
  margin: 0 0 0.65rem;
  font-size: 0.9rem;
}

.settings-stats {
  gap: 0;
}

.settings-stats > div {
  min-height: 2.1rem;
  box-sizing: border-box;
  padding: 0.45rem 0.65rem;
  border: 1px solid #E2E8F0;
  border-bottom: 0;
  background: #FFFFFF;
}

.settings-stats > div:last-child {
  border-bottom: 1px solid #E2E8F0;
}

.settings-stats dt {
  font-weight: 700;
}

.settings-stats dd {
  font-size: 0.95rem;
}

.settings-latest-booking {
  margin-top: 1rem;
  padding: 0.85rem 0 0;
}

.settings-latest-booking p {
  margin: 0.3rem 0;
  font-size: 0.85rem;
}

.settings-latest-booking .settings-booking-title {
  font-size: 0.9rem;
}

.settings-top-users {
  margin-top: 1rem;
  padding-top: 0.85rem;
  border-top: 1px solid #E2E8F0;
}

.settings-top-users h4 {
  margin-bottom: 0.55rem;
}

.settings-top-users ol {
  margin: 0;
  padding-left: 1.5rem;
}

.settings-top-users li {
  display: flex;
  justify-content: space-between;
  gap: 0.75rem;
  padding: 0.4rem 0.55rem;
  border-bottom: 1px solid #E2E8F0;
  color: #17324D;
}

.settings-top-users li:last-child {
  border-bottom: 0;
}

.settings-top-users li strong {
  color: #0F766E;
  white-space: nowrap;
}

.settings-top-users .settings-empty-ranking {
  display: list-item;
  color: #536579;
}

/* Typographie et boutons des Paramètres alignés sur le reste du site. */
.settings-page {
  font-size: 0.9rem;
  line-height: 1.45;
}

.settings-page h2 {
  font-size: 1.2rem;
}

.settings-layout .settings-link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  max-height: 1.75rem !important;
  box-sizing: border-box !important;
  padding: 2px 16px !important;
  border: 0 !important;
  border-radius: 20px !important;
  background: #FFFFFF !important;
  color: #1F2937 !important;
  box-shadow: 0 4px 10px rgba(107, 114, 128, 0.28) !important;
  font-family: inherit !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

.settings-layout .settings-link:hover,
.settings-layout .settings-link:focus {
  background: #F3F4F6 !important;
  color: #1F2937 !important;
  box-shadow: 0 6px 14px rgba(107, 114, 128, 0.38) !important;
}

/* Référence typographique : boutons Mois, Semaine et Jour. */
.banner nav.menu a,
.banner nav.quick-links a,
.banner nav.user-nav a,
.banner nav.user-nav input,
.banner nav.user-nav span,
.settings-layout .settings-link,
.settings-summary {
  font-size: 0.9rem !important;
}

/* Même taille pour tous les contrôles du compte connecté. */
.banner nav.user-nav a.account-settings-action,
.banner nav.user-nav > span.connected-user-name,
.banner nav.user-nav > span.quota-status,
.banner nav.user-nav input.account-action,
.banner nav.user-nav input[value="Se déconnecter"],
.banner nav.user-nav input[value="Log off"],
.banner nav.user-nav form#show_my_entries input[type="submit"] {
  font-size: 0.9rem !important;
}

/* Libellés du menu avec casse normale et poids de police standard. */
.banner nav.menu a,
.banner nav.menu summary,
.banner nav.quick-links a,
.banner nav.user-nav a,
.banner nav.user-nav input,
.banner nav.user-nav span {
  text-transform: none !important;
  font-weight: 400 !important;
}

/* Action principale légèrement agrandie. */
.banner .company > a.button[href="edit_entry.php"] {
  height: 2.7rem !important;
  min-height: 2.7rem !important;
  padding-left: 2.45em !important;
  padding-right: 40px !important;
  font-size: 15px !important;
}

/* Alignement des boutons Retour et Enregistrer du formulaire de réservation. */
.edit_entry form#main .submit_buttons {
  display: flex !important;
  align-items: center !important;
  gap: 0.75rem !important;
  flex-wrap: wrap;
}

.edit_entry form#main .submit_buttons > label,
.edit_entry form#main .submit_buttons > input,
.edit_entry form#main .submit_buttons > div {
  margin: 0 !important;
  vertical-align: middle !important;
}

.edit_entry form#main .submit_buttons > label {
  display: inline-flex !important;
  align-items: center;
  padding: 0 !important;
}

.edit_entry form#main .submit_buttons #checks {
  margin-left: 0.25rem !important;
}

@media (max-width: 30rem) {
  .edit_entry form#main .submit_buttons {
    align-items: center !important;
    flex-direction: row !important;
    flex-wrap: nowrap;
    gap: 0.5rem !important;
  }

  .edit_entry form#main .submit_buttons > label,
  .edit_entry form#main .submit_buttons > input,
  .edit_entry form#main .submit_buttons > div {
    width: auto;
    flex: 0 1 auto;
    box-sizing: border-box;
  }
}

/* Même ligne de base et même hauteur pour Retour et Enregistrer. */
.edit_entry form#main .submit_buttons > label,
.edit_entry form#main .submit_buttons > input[type="submit"] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center;
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  max-height: 1.75rem !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding-top: 2px !important;
  padding-bottom: 2px !important;
  vertical-align: middle !important;
}

.edit_entry form#main .submit_buttons > label > input[type="submit"] {
  height: 100% !important;
  min-height: 0 !important;
  max-height: none !important;
  margin: 0 !important;
}

/* Le bouton Enregistrer est dans le conteneur de contrôle du champ. */
.edit_entry form#main .submit_buttons > div {
  display: flex !important;
  align-items: center !important;
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  margin: 0 !important;
  padding: 0 !important;
}

.edit_entry form#main .submit_buttons > div > input[type="submit"] {
  display: inline-flex !important;
  align-items: center !important;
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  margin: 0 !important;
}

.edit_entry form#main .submit_buttons #checks {
  height: auto !important;
  min-height: 0 !important;
  margin-left: 0.5rem !important;
}

/* Adaptation mobile des formulaires ajoutés. */
@media (max-width: 40rem) {
  .settings-page {
    width: 100%;
    box-sizing: border-box;
    padding: 0.75rem;
  }

  .settings-links {
    grid-template-columns: 1fr;
    gap: 0.75rem;
    margin-top: 1rem;
  }

  .quota-selector,
  .quota-edit-card {
    width: 100%;
    padding: 0.85rem;
  }

  .quota-selector > div,
  .quota-edit-form {
    align-items: stretch;
    flex-direction: column;
  }

  .quota-selector label,
  .quota-edit-form label,
  .quota-selector input[type="search"],
  .quota-selector select,
  .quota-edit-form input[type="number"],
  .quota-selector button,
  .quota-edit-form button {
    width: 100%;
    box-sizing: border-box;
  }

  .quota-selector button,
  .quota-edit-form button {
    margin-top: 0.15rem;
  }

  .quota-help {
    font-size: 0.78rem;
  }
}

/* Harmonisation des formulaires ajoutés avec le formulaire de réservation. */
.settings-page {
  color: #17324D;
  font-family: inherit;
}

.settings-page h2,
.settings-page h3 {
  color: #17324D;
  font-weight: 700;
}

.quota-selector,
.quota-edit-card {
  box-sizing: border-box;
  padding: 1rem;
  border: 1px solid #CBD5E1;
  border-radius: 8px;
  background: #FFFFFF;
  box-shadow: 0 4px 10px rgba(23, 50, 77, 0.12);
}

.quota-selector {
  margin-top: 1.25rem;
}

.quota-selector > div,
.quota-edit-form {
  gap: 0.75rem;
}

.quota-selector label,
.quota-edit-form label {
  color: #17324D;
  font-weight: 700;
}

.quota-selector input[type="search"],
.quota-selector select,
.quota-edit-form input[type="number"] {
  min-height: 2.1rem;
  border: 1px solid #AAB8C7;
  border-radius: 8px;
  background: #FFFFFF;
  color: #17324D;
  font-family: inherit;
  font-size: 0.95rem;
  padding: 4px 10px;
}

.quota-selector input[type="search"]:focus,
.quota-selector select:focus,
.quota-edit-form input[type="number"]:focus {
  border-color: #3C8CCC;
  outline: 2px solid rgba(60, 140, 204, 0.2);
  outline-offset: 1px;
}

.quota-edit-card {
  margin-top: 1.25rem;
}

.quota-help-title {
  color: #17324D;
  font-weight: 700;
}

.quota-help {
  color: #536579;
}

.quota-search {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin: 1.25rem 0;
}

.quota-search input[type="search"] {
  width: min(24rem, 100%);
}

.quota-selector {
  display: grid;
  gap: 1rem;
  margin: 1.25rem 0;
  font-family: inherit;
  font-size: inherit;
}

.quota-selector > div {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.quota-selector input[type="search"] {
  width: min(24rem, 100%);
}

.quota-selector input[type="search"],
.quota-selector select,
.quota-edit-form input[type="number"] {
  height: 2.1rem;
  box-sizing: border-box;
  padding: 4px 10px;
  border: 1px solid #CBD5E1;
  border-radius: 8px;
  background: #FFFFFF;
  color: #17324D;
  font: inherit;
}

.quota-selector label,
.quota-edit-form label {
  font-weight: 700;
}

.quota-selector select {
  min-width: min(32rem, 100%);
}

.quota-edit-card {
  max-width: 42rem;
  margin-top: 1.5rem;
  padding: 1rem 1.25rem;
  border-radius: 14px;
  background: #F8FAFC;
  box-shadow: 0 5px 14px rgba(23, 50, 77, 0.14);
}

.quota-edit-card .quota-edit-form {
  margin-top: 1rem;
}

.banner nav.user-nav a.account-settings-action {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  height: 1.75rem !important;
  min-height: 0 !important;
  max-height: 1.75rem !important;
  box-sizing: border-box !important;
  padding: 2px 16px !important;
  border-radius: 20px !important;
  background: #EAF4FC !important;
  color: #17324D !important;
  box-shadow: 0 4px 10px rgba(60, 140, 204, 0.28) !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  white-space: nowrap;
  filter: drop-shadow(0 4px 5px rgba(60, 140, 204, 0.28));
}

/* The reservation action uses the same white treatment as the other controls. */
.banner .company > a.button[href="edit_entry.php"] {
  color: #0F766E !important;
  background-color: #FFFFFF !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%230F766E' stroke-width='2.5' d='M12 5v14M5 12h14'/%3E%3C/svg%3E") !important;
  box-shadow: 0 4px 10px rgba(107, 114, 128, 0.22) !important;
}

.banner .company > a.button[href="edit_entry.php"]:hover,
.banner .company > a.button[href="edit_entry.php"]:focus {
  color: #0F766E !important;
  background-color: #E5E7EB !important;
}

/* Use the logout button colour for every right-side account control. */
.banner nav.user-nav form input.account-action,
.banner nav.user-nav form#show_my_entries input[type="submit"],
.banner nav.user-nav > span.quota-status,
.banner nav.user-nav a.account-settings-action {
  background-color: #F3F4F6 !important;
  color: #1F2937 !important;
  box-shadow: 0 4px 10px rgba(107, 114, 128, 0.22) !important;
}

.banner nav.user-nav a.account-settings-action:hover,
.banner nav.user-nav a.account-settings-action:focus,
.banner nav.user-nav > span.quota-status:hover,
.banner nav.user-nav > span.quota-status:focus {
  background-color: #E5E7EB !important;
  color: #1F2937 !important;
}

/* Exact same height for every control in the right account navigation. */
.banner nav.user-nav form input.account-action,
.banner nav.user-nav form#show_my_entries input[type="submit"],
.banner nav.user-nav > span.quota-status,
.banner nav.user-nav a.account-settings-action {
  height: 1.75rem !important;
  min-height: 0 !important;
  max-height: 1.75rem !important;
  box-sizing: border-box !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  vertical-align: middle !important;
}

.quota-edit-card h3,
.quota-edit-card p {
  margin-top: 0;
}

.quota-edit-card .quota-current-month {
  color: #17324D;
  font-size: 0.9rem;
}

.quota-help {
  margin-top: 0.25rem;
  color: #536579;
  font-size: 0.8rem;
  line-height: 1.45;
}

.quota-help-title {
  margin: 1.5rem 0 0;
  color: #17324D;
  font-size: 0.9rem;
  font-weight: 700;
}

/* Présentation professionnelle des informations de l'utilisateur sélectionné. */
.quota-page .quota-edit-card {
  width: 100%;
  max-width: 42rem;
  padding: 1.25rem;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

/* Même largeur et même cadre que le formulaire standard de réservation. */
.quota-page .quota-selector {
  width: 100%;
  max-width: 42rem;
  margin: 2rem 0 0;
  padding: 1rem 1.25rem;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.quota-page .quota-selector input[type="search"],
.quota-page .quota-selector select,
.quota-page .quota-edit-form input[type="number"] {
  min-height: 2rem;
  height: 2rem;
  border-radius: 6px;
}

.quota-page .quota-edit-form button,
.quota-page .quota-selector button {
  min-height: 1.75rem;
  height: 1.75rem;
  padding: 2px 16px;
  border-radius: 6px;
}

/* Sur ordinateur, le contenu des quotas s'aligne à gauche comme les autres pages. */
@media (min-width: 40.01rem) {
  .settings-page.quota-page {
    margin-left: 0 !important;
    margin-right: auto !important;
    text-align: left !important;
  }
}

.quota-page .quota-edit-card h3 {
  margin: 0 0 0.2rem;
  font-size: 1.15rem;
  color: #17324D;
}

.quota-page .quota-edit-card > p:not(.quota-current-month) {
  margin: 0.15rem 0;
  color: #536579;
  font-size: 0.88rem;
}

.quota-page .quota-current-month {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin: 0.7rem 0 0;
  padding: 0.75rem 0.9rem;
  border: 1px solid #D7E5F1;
  border-radius: 9px;
  background: #FFFFFF;
  color: #17324D;
  font-size: 0.9rem;
}

.quota-page .quota-current-month {
  border-color: rgba(68, 188, 180, 0.45);
  background: rgba(68, 188, 180, 0.08);
}

.quota-page .quota-result-value {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.5rem;
  min-height: 1.5rem;
  padding: 0 0.3rem;
  border-radius: 50%;
  background: #3C8CCC;
  color: #FFFFFF;
  font-size: 0.75rem;
  font-weight: 700;
}

.quota-page .quota-current-month .quota-result-value {
  background: #44BCB4;
}

/* Le cadre Informations globales reste sans fond, comme les formulaires standards. */
.settings-page .settings-summary {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.settings-page .settings-summary .settings-stats {
  background: transparent !important;
  box-shadow: none !important;
}

.settings-page .settings-summary .settings-stats > div {
  background: transparent !important;
}

.booking-conflict-message {
  max-width: 42rem;
  margin: 1.25rem 0;
  padding: 1rem 1.15rem;
  border-left: 4px solid #E45CD4;
  border-radius: 8px;
  background: #F7FBFF;
  color: #17324D;
  box-shadow: 0 4px 10px rgba(23, 50, 77, 0.10);
}

.booking-conflict-message h2 {
  margin: 0 0 0.75rem;
  color: #3C8CCC;
  font-size: 1rem;
}

.booking-conflict-message p {
  margin: 0.5rem 0;
  color: #536579;
}

.booking-conflict-message ul {
  margin: 0.5rem 0 0;
  padding-left: 1.25rem;
}

.booking-conflict-message li {
  margin: 0.3rem 0;
}

/* Fenêtre de détails ouverte au clic sur Calendrier ou Règles. */
.ui-dialog.ui-tabs,
.ui-dialog.ui-tabs .ui-dialog-content,
.ui-dialog.ui-tabs #check_tabs,
.ui-dialog.ui-tabs #schedule_details,
.ui-dialog.ui-tabs #policy_details {
  border-color: #D7E5F1 !important;
  background: #F3F4F6 !important;
  color: #17324D !important;
}

.ui-dialog.ui-tabs #schedule_details.has-conflict,
.ui-dialog.ui-tabs #policy_details.has-rule-issue {
  color: #B91C1C !important;
}

.ui-dialog.ui-tabs #schedule_details.has-conflict p,
.ui-dialog.ui-tabs #schedule_details.has-conflict li,
.ui-dialog.ui-tabs #policy_details.has-rule-issue p,
.ui-dialog.ui-tabs #policy_details.has-rule-issue li {
  color: #B91C1C !important;
}

.ui-dialog.ui-tabs #details_tabs {
  border: 0 !important;
  background: transparent !important;
}

.ui-dialog.ui-tabs #details_tabs li a {
  border: 1px solid #D7E5F1 !important;
  border-radius: 7px 7px 0 0;
  background: #E5E7EB !important;
  color: #17324D !important;
}

.ui-dialog.ui-tabs #details_tabs li.ui-tabs-active a {
  background: #D1D5DB !important;
  color: #17324D !important;
}

.ui-dialog.ui-tabs .ui-state-highlight,
.ui-dialog.ui-tabs .ui-widget-content,
.ui-dialog.ui-tabs .ui-widget-header {
  background: #F3F4F6 !important;
  color: #17324D !important;
}

.ui-dialog.ui-tabs .ui-dialog-titlebar-close,
.ui-dialog.ui-tabs #ui-tab-dialog-close button {
  min-height: 1.5rem !important;
  width: 1.5rem !important;
  padding: 0 !important;
  border: 1px solid #B8BEC8 !important;
  border-radius: 50% !important;
  background: #D1D5DB !important;
  background-image: none !important;
  color: #374151 !important;
  box-shadow: none !important;
}

.ui-dialog.ui-tabs .ui-dialog-titlebar-close:hover,
.ui-dialog.ui-tabs .ui-dialog-titlebar-close:focus,
.ui-dialog.ui-tabs #ui-tab-dialog-close button:hover,
.ui-dialog.ui-tabs #ui-tab-dialog-close button:focus {
  background: #B8BEC8 !important;
  color: #1F2937 !important;
}

/* Les détails restent visibles directement sous les boutons du formulaire. */
.edit_entry form#main #check_results {
  display: none !important;
  width: fit-content;
  max-width: 42rem;
  box-sizing: border-box;
  margin-top: 0.75rem;
  padding: 0.35rem;
  border: 0 !important;
  border-radius: 16px;
  background: transparent !important;
  color: #17324D !important;
}

.edit_entry form#main #check_results.has-issue {
  display: inline-block !important;
  vertical-align: top;
}

.edit_entry form#main #check_results #details_tabs,
.edit_entry form#main #check_results .ui-tabs-panel {
  background: transparent !important;
}

.edit_entry form#main #check_results #details_tabs li a {
  border: 1px solid #B8BEC8 !important;
  border-radius: 6px 6px 0 0;
  background: #E5E7EB !important;
  color: #17324D !important;
}

.edit_entry form#main #check_results #details_tabs li.ui-tabs-active a {
  background: #D1D5DB !important;
}

/* Boutons Calendrier et Règles alignés sur les boutons du site. */
.edit_entry form#main #check_results #details_tabs li a,
.ui-dialog.ui-tabs #details_tabs li a {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 1.75rem !important;
  height: 1.75rem !important;
  box-sizing: border-box;
  padding: 3px 16px !important;
  border: 0 !important;
  border-radius: 20px !important;
  background: #E6FFFF !important;
  color: #000000 !important;
  box-shadow: 0 3px 8px rgba(23, 50, 77, 0.12) !important;
  font-size: 12px !important;
  font-weight: 700 !important;
}

.edit_entry form#main #check_results #details_tabs li a:hover,
.edit_entry form#main #check_results #details_tabs li a:focus,
.ui-dialog.ui-tabs #details_tabs li a:hover,
.ui-dialog.ui-tabs #details_tabs li a:focus,
.edit_entry form#main #check_results #details_tabs li.ui-tabs-active a,
.ui-dialog.ui-tabs #details_tabs li.ui-tabs-active a {
  background: #C9EEEE !important;
  color: #000000 !important;
  box-shadow: 0 5px 12px rgba(23, 50, 77, 0.2) !important;
}

.edit_entry form#main #check_details > div {
  display: block;
  width: fit-content;
  max-width: 100%;
  margin: 0.35rem 0;
  padding: 0.25rem 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.edit_entry form#main #check_details > div + div {
  border-top: 1px solid #D1D5DB;
}

.edit_entry form#main #check_details p {
  margin: 0.25rem 0;
  color: #B91C1C !important;
}

.edit_entry form#main #check_details ul {
  margin: 0.35rem 0 0;
  padding-left: 1.25rem;
}

.edit_entry form#main #check_details,
.edit_entry form#main #check_details li,
.edit_entry form#main #check_details a {
  color: #B91C1C !important;
}

.edit_entry form#main #check_details #schedule_details.has-conflict p,
.edit_entry form#main #check_details #schedule_details.has-conflict li,
.edit_entry form#main #check_details #policy_details.has-rule-issue p,
.edit_entry form#main #check_details #policy_details.has-rule-issue li {
  color: #B91C1C !important;
}

.settings-page .settings-summary .settings-stats dt {
  font-size: 0.8rem !important;
  font-weight: 400 !important;
}

.settings-page .settings-summary .settings-stats dd {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-width: 1.5rem;
  min-height: 1.5rem;
  padding: 0 0.3rem;
  border-radius: 50%;
  background: #3C8CCC;
  color: #FFFFFF !important;
  font-size: 0.75rem !important;
  font-weight: 700 !important;
}

.banner nav.user-nav a.connected-user {
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  max-height: 1.75rem !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  position: relative;
  top: 2px;
  box-shadow: 0 5px 13px rgba(23, 50, 77, 0.28) !important;
  filter: drop-shadow(0 3px 4px rgba(23, 50, 77, 0.18));
}

.banner nav.user-nav a.connected-user:hover,
.banner nav.user-nav a.connected-user:focus {
  box-shadow: 0 7px 17px rgba(23, 50, 77, 0.36) !important;
  filter: drop-shadow(0 4px 6px rgba(23, 50, 77, 0.24));
}


/* Rapport personnel : même présentation que les autres formulaires du site. */
.user-report-page {
  max-width: 64rem;
}

.user-report-intro {
  margin: 0.25rem 0 1.25rem;
  color: #536579;
  font-size: 0.9rem;
}

.user-report-table-wrap {
  width: 100%;
  overflow-x: auto;
}

.user-report-table {
  width: 100%;
  border-collapse: collapse;
  color: #17324D;
  font-size: 0.9rem;
}

.user-report-table th,
.user-report-table td {
  padding: 0.7rem 0.8rem;
  border-bottom: 1px solid #D7E5F1;
  text-align: left;
  vertical-align: top;
}

.user-report-table th {
  color: #17324D;
  font-weight: 700;
}

.user-report-description {
  color: #536579;
  font-size: 0.82rem;
}

.user-report-empty {
  color: #536579;
  font-size: 0.9rem;
}

/* Reprise exacte de l'affichage des rapports MRBS. */
.user-report-table {
  border-collapse: separate !important;
  border-spacing: 0 !important;
  font-size: inherit !important;
}

.user-report-table th,
.user-report-table td {
  height: 2em !important;
  padding: 3px 24px 3px 8px !important;
  border-bottom: 0 !important;
  white-space: nowrap;
  overflow: hidden;
}

.user-report-table .user-report-description {
  display: inline !important;
  color: #536579;
  font-size: 0.82rem;
}

@media (max-width: 40rem) {
  .user-report-table {
    min-width: 38rem;
  }
}

/* Harmonise the explanatory text used inside the site's forms. */
.standard fieldset > div > p,
.standard fieldset > div > ul {
  font-size: 0.8rem;
  line-height: 1.45;
}

.quota-table-wrap {
  overflow-x: auto;
}

.quota-table {
  width: 100%;
}

.quota-edit-form {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.quota-edit-form input[type="number"] {
  width: 8rem;
  box-sizing: border-box;
}

@media (max-width: 40rem) {
  .quota-search,
  .quota-selector > div,
  .quota-edit-form {
    align-items: stretch;
    flex-direction: column;
  }
}

/* Dernière priorité : texte de « Ajouter une réservation » dans le vert du calendrier. */
.banner .company > a.button[href="edit_entry.php"],
.banner .company > a.button[href="edit_entry.php"]:hover,
.banner .company > a.button[href="edit_entry.php"]:focus {
  color: #9ADFC0 !important;
}

/* Icône réglages intégrée au bouton Paramètres. */
.banner nav.user-nav a.account-settings-action {
  padding-left: 2.2em !important;
  min-height: 1.9rem !important;
  height: 1.9rem !important;
  padding-right: 18px !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke='%231F2937' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M12 2v3M12 19v3M2 12h3M19 12h3M4.9 4.9l2.1 2.1M17 17l2.1 2.1M19.1 4.9 17 7M7 17l-2.1 2.1'/%3E%3C/g%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: 0.65em center !important;
  background-size: 1.05em 1.05em !important;
}

/* Priorité finale : Paramètres comme le menu, Ajouter une réservation un peu plus grand. [FIN] */
.banner nav.user-nav a.account-settings-action {
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  max-height: 1.75rem !important;
  padding-right: 16px !important;
}

.banner .company > a.button[href="edit_entry.php"] {
  height: 2.6rem !important;
  min-height: 2.6rem !important;
  padding-left: 2.35em !important;
  padding-right: 36px !important;
}

/* Priorité finale : formulaires ajoutés alignés sur le formulaire standard. [FIN] */
.settings-page {
  color: #17324D;
  font-family: inherit;
}

.settings-page h2,
.settings-page h3 {
  color: #17324D;
  font-weight: 700;
}

.quota-selector,
.quota-edit-card {
  box-sizing: border-box;
  padding: 1rem;
  border: 1px solid #CBD5E1;
  border-radius: 8px;
  background: #FFFFFF;
  box-shadow: 0 4px 10px rgba(23, 50, 77, 0.12);
}

.quota-selector {
  margin-top: 1.25rem;
}

.quota-selector > div,
.quota-edit-form {
  gap: 0.75rem;
}

.quota-selector label,
.quota-edit-form label {
  color: #17324D;
  font-weight: 700;
}

.quota-selector input[type="search"],
.quota-selector select,
.quota-edit-form input[type="number"] {
  min-height: 2.1rem;
  border: 1px solid #AAB8C7;
  border-radius: 8px;
  background: #FFFFFF;
  color: #17324D;
  font-family: inherit;
  font-size: 0.95rem;
  padding: 4px 10px;
}

.quota-selector input[type="search"]:focus,
.quota-selector select:focus,
.quota-edit-form input[type="number"]:focus {
  border-color: #3C8CCC;
  outline: 2px solid rgba(60, 140, 204, 0.2);
  outline-offset: 1px;
}

.quota-edit-card {
  margin-top: 1.25rem;
}

.quota-help-title {
  color: #17324D;
  font-weight: 700;
}

.quota-help {
  color: #536579;
}

/* Priorité absolue : menu et compte en poids normal. */
.banner nav.menu a,
.banner nav.menu a.menu-item,
.banner nav.menu summary,
.banner nav.menu details.menu-settings > summary.menu-settings-toggle,
.banner nav.quick-links a,
.banner nav.quick-links a.quick-access,
.banner nav.quick-links a.quick-calendar,
.banner nav.user-nav a,
.banner nav.user-nav a.account-settings-action,
.banner nav.user-nav input,
.banner nav.user-nav input.account-action,
.banner nav.user-nav form#show_my_entries input[type="submit"],
.banner nav.user-nav span,
.banner nav.user-nav > span.quota-status,
.banner nav.user-nav > span.connected-user-name,
.banner nav.logon input[type="submit"],
.banner nav.logon input[value="S'identifier"],
.banner nav.logon input[value="Se déconnecter"],
.banner nav.logon input[value="Log off"],
.dwm_main nav.view a,
.dwm_main nav.arrow a,
nav.view a,
nav.arrow a,
.settings-layout .settings-link {
  font-size: 0.85rem !important;
  font-weight: 700 !important;
}

/* Bouton Ajouter une réservation légèrement agrandi. */
.banner .company > a.button[href="edit_entry.php"] {
  height: 2.9rem !important;
  min-height: 2.9rem !important;
  padding-left: 2.6em !important;
  padding-right: 46px !important;
  font-size: 16px !important;
}

/* Alignement final des boutons Aujourd'hui, Semaine, Jour et Mois. */
nav.view,
nav.arrow {
  display: inline-flex !important;
  align-items: stretch !important;
  vertical-align: middle !important;
}

nav.view a,
nav.arrow a {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  box-sizing: border-box !important;
  line-height: 1 !important;
  vertical-align: middle !important;
}

/* Priorité absolue : même fond verre que les réservations du calendrier. */
.banner .company > a.button[href="edit_entry.php"] {
  background-color: #E7F8F6 !important;
  color: #14532D !important;
  box-shadow: 0 5px 14px rgba(68, 188, 180, 0.28) !important;
}

.banner .company > a.button[href="edit_entry.php"]:hover,
.banner .company > a.button[href="edit_entry.php"]:focus {
  background-color: #D5F2E6 !important;
  color: #14532D !important;
}

/* Largeur compacte finale du bouton principal. */
.banner .company > a.button[href="edit_entry.php"] {
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  max-height: 1.75rem !important;
  padding-left: 1.85em !important;
  padding-right: 8px !important;
  box-sizing: border-box !important;
  line-height: 1 !important;
}

/* Même hauteur et même alignement pour toute la navigation supérieure. */
.banner nav.menu a,
.banner nav.quick-links a,
.banner nav.user-nav a,
.banner nav.user-nav input,
.banner nav.user-nav span,
.banner .company > a.button[href="edit_entry.php"] {
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  max-height: 1.75rem !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  line-height: 1 !important;
  vertical-align: middle !important;
}

/* Hauteur légèrement augmentée à la demande pour l'action principale. */
.banner .company > a.button[href="edit_entry.php"] {
  height: 1.9rem !important;
  min-height: 1.9rem !important;
  max-height: 1.9rem !important;
  padding-left: 2em !important;
  padding-right: 20px !important;
  font-size: 16px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Alignement précis du contenu du compteur de quota. */
.banner nav.user-nav > span.quota-status {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  white-space: nowrap !important;
}

.banner nav.user-nav > span.quota-status .quota-label,
.banner nav.user-nav > span.quota-status .quota-value {
  display: inline-flex !important;
  align-items: center !important;
  line-height: 1 !important;
  vertical-align: middle !important;
}

/* Police légèrement réduite pour les libellés du menu. */
.banner nav.menu a,
.banner nav.menu summary,
.banner nav.quick-links a,
.banner nav.user-nav a,
.banner nav.user-nav input,
.banner nav.user-nav span,
nav.view a,
nav.arrow a {
  font-size: 0.75rem !important;
}

/* Retrait de l'effet d'ombre sur les boutons de navigation. */
.banner nav.menu a,
.banner nav.menu summary,
.banner nav.quick-links a,
.banner nav.user-nav a,
.banner nav.user-nav input,
.banner nav.user-nav span,
nav.view a,
nav.arrow a {
  box-shadow: none !important;
  filter: none !important;
}

/* Priorité renforcée pour les contrôles du compte. */
.banner nav.user-nav a.connected-user,
.banner nav.user-nav a.connected-user:hover,
.banner nav.user-nav a.connected-user:focus,
.banner nav.user-nav input.account-action,
.banner nav.user-nav input.account-action:hover,
.banner nav.user-nav input.account-action:focus {
  font-size: 0.75rem !important;
  box-shadow: none !important;
  filter: none !important;
}

/* Aucun effet d'ombre sur les deux actions demandées. */
.banner nav.user-nav input[value="Se déconnecter"],
.banner nav.user-nav input[value="Se déconnecter"]:hover,
.banner nav.user-nav input[value="Se déconnecter"]:focus,
.banner nav.user-nav input[value="Log off"],
.banner nav.user-nav input[value="Log off"]:hover,
.banner nav.user-nav input[value="Log off"]:focus,
.banner .company > a.button[href="edit_entry.php"],
.banner .company > a.button[href="edit_entry.php"]:hover,
.banner .company > a.button[href="edit_entry.php"]:focus {
  box-shadow: none !important;
  filter: none !important;
}

/* Le formulaire parent du bouton de déconnexion ne doit pas recréer d'ombre. */
.banner nav.user-nav form,
.banner nav.user-nav form input.account-action,
.banner nav.user-nav form input.account-action:hover,
.banner nav.user-nav form input.account-action:focus {
  box-shadow: none !important;
  filter: none !important;
}

/* Taille de référence : le texte du bouton « Quota : illimité ». */
.banner nav.menu a,
.banner nav.menu summary,
.banner nav.menu details.menu-settings > summary.menu-settings-toggle,
.banner nav.quick-links a,
.banner nav.quick-links summary,
.banner nav.user-nav a,
.banner nav.user-nav input,
.banner nav.user-nav span,
.banner nav.user-nav span.quota-status .quota-label,
.banner nav.user-nav span.quota-status .quota-value,
nav.view a,
nav.arrow a,
.settings-layout .settings-link {
  font-size: 0.75rem !important;
}

/* Le bouton Paramètres reprend explicitement la taille du bouton Quota. */
.banner nav.user-nav a.account-settings-action,
.banner nav.user-nav a.account-settings-action:hover,
.banner nav.user-nav a.account-settings-action:focus {
  font-size: 0.75rem !important;
}

/* Action principale légèrement élargie et vert encore plus clair. */
.banner .company > a.button[href="edit_entry.php"] {
  padding-left: 2.15em !important;
  padding-right: 34px !important;
  background-color: #F0FBF8 !important;
}

.banner .company > a.button[href="edit_entry.php"]:hover,
.banner .company > a.button[href="edit_entry.php"]:focus {
  background-color: #E7F8F6 !important;
  transform: scale(1.03) !important;
}

.banner .company > a.button[href="edit_entry.php"] {
  transform: scale(1.03) !important;
  transform-origin: left center !important;
  background: #F0FBF8 !important;
  background-image: none !important;
  padding-left: 20px !important;
}

.banner .company > a.button[href="edit_entry.php"]:hover,
.banner .company > a.button[href="edit_entry.php"]:focus {
  background: #E7F8F6 !important;
  background-image: none !important;
  color: #1E3A8A !important;
}

/* Hauteur augmentée pour le bouton principal. */
.banner .company > a.button[href="edit_entry.php"] {
  height: 2.4rem !important;
  min-height: 2.4rem !important;
  max-height: 2.4rem !important;
  padding-left: 2.5em !important;
  padding-right: 46px !important;
  font-size: 16px !important;
  color: #1E3A8A !important;
  transform: none !important;
}

.banner .company > a.button[href="edit_entry.php"]:hover,
.banner .company > a.button[href="edit_entry.php"]:focus {
  transform: none !important;
  color: #1E3A8A !important;
}

/* Le bouton Utilisateur connecté reprend le fond du bouton principal. */
.banner nav.user-nav a.connected-user,
.banner nav.user-nav a.connected-user:hover,
.banner nav.user-nav a.connected-user:focus {
  background: #F0FBF8 !important;
  background-image: none !important;
  color: #14532D !important;
}

/* Dimensions identiques pour les quatre boutons du compte. */
.banner nav.user-nav a.connected-user,
.banner nav.user-nav > span.quota-status,
.banner nav.user-nav a.account-settings-action,
.banner nav.user-nav input.account-action,
.banner nav.user-nav input[value="Se déconnecter"],
.banner nav.user-nav input[value="Log off"] {
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  max-height: 1.75rem !important;
  box-sizing: border-box !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  line-height: 1 !important;
  vertical-align: middle !important;
}

/* Le bouton Utilisateur connecté ne doit plus être décalé ni plus haut. */
.banner nav.user-nav a.connected-user,
.banner nav.user-nav a.connected-user:hover,
.banner nav.user-nav a.connected-user:focus {
  top: 0 !important;
  position: static !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 16px !important;
  padding-right: 16px !important;
  padding-top: 2px !important;
  padding-bottom: 2px !important;
}

/* Même gabarit que Quota pour le bouton Utilisateur connecté. */
.banner nav.user-nav a.connected-user,
.banner nav.user-nav a.connected-user:hover,
.banner nav.user-nav a.connected-user:focus {
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  max-height: 1.75rem !important;
  box-sizing: border-box !important;
  padding-top: 2px !important;
  padding-bottom: 2px !important;
  line-height: 1.25em !important;
}

/* Ombre portée légère et uniforme sur le menu et les contrôles du compte. */
.banner nav.menu a,
.banner nav.quick-links a,
.banner nav.user-nav a,
.banner nav.user-nav input,
.banner nav.user-nav span {
  box-shadow: 0 4px 10px rgba(23, 50, 77, 0.22) !important;
  filter: none !important;
}

.banner nav.menu a:hover,
.banner nav.menu a:focus,
.banner nav.quick-links a:hover,
.banner nav.quick-links a:focus,
.banner nav.user-nav a:hover,
.banner nav.user-nav a:focus,
.banner nav.user-nav input:hover,
.banner nav.user-nav input:focus,
.banner nav.user-nav span:hover,
.banner nav.user-nav span:focus {
  box-shadow: 0 6px 14px rgba(23, 50, 77, 0.28) !important;
}

/* User name and logout match Settings and Quotas exactly. */
.banner nav.user-nav a.connected-user,
.banner nav.user-nav input[value="Se déconnecter"],
.banner nav.user-nav input[value="Log off"] {
  color: #1F2937 !important;
  background-color: #F3F4F6 !important;
  box-shadow: 0 4px 10px rgba(23, 50, 77, 0.22) !important;
}

.banner nav.user-nav a.connected-user:hover,
.banner nav.user-nav a.connected-user:focus,
.banner nav.user-nav input[value="Se déconnecter"]:hover,
.banner nav.user-nav input[value="Se déconnecter"]:focus,
.banner nav.user-nav input[value="Log off"]:hover,
.banner nav.user-nav input[value="Log off"]:focus {
  color: #1F2937 !important;
  background-color: #E5E7EB !important;
  box-shadow: 0 6px 14px rgba(23, 50, 77, 0.28) !important;
}

/* Settings buttons use the same light shadow as the menu and account controls. */
.settings-layout .settings-link {
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  max-height: 1.75rem !important;
  box-sizing: border-box !important;
  padding: 4px 25px !important;
  border-radius: 20px !important;
  color: #1F2937 !important;
  background: #F3F4F6 !important;
  box-shadow: 0 7px 16px rgba(107, 114, 128, 0.36) !important;
  filter: none !important;
}

.settings-layout .settings-link:hover,
.settings-layout .settings-link:focus {
  color: #1F2937 !important;
  background: #E5E7EB !important;
  box-shadow: 0 9px 20px rgba(107, 114, 128, 0.45) !important;
}

/* Ajouter une réservation : légère ombre, couleur existante conservée. */
.banner .company > a.button[href="edit_entry.php"] {
  height: 2.2rem !important;
  min-height: 2.2rem !important;
  max-height: 2.2rem !important;
  padding: 4px 25px !important;
  font-size: 14px !important;
  border: 2px solid #0F766E !important;
  box-shadow: 0 4px 10px rgba(107, 114, 128, 0.22) !important;
}

.banner .company > a.button[href="edit_entry.php"]:hover,
.banner .company > a.button[href="edit_entry.php"]:focus {
  box-shadow: 0 6px 14px rgba(107, 114, 128, 0.28) !important;
}

/* Le bouton de déconnexion est déplacé dans Paramètres sur mobile. */
.settings-mobile-actions {
  display: none;
}

.settings-mobile-actions input.account-action {
  min-height: 1.75rem;
  box-sizing: border-box;
  padding: 4px 25px;
  border: 0;
  border-radius: 20px;
  color: #1F2937 !important;
  background: #F3F4F6 !important;
  font-size: 0.75rem;
  font-weight: 700;
  cursor: pointer;
}

.settings-mobile-actions input.account-action:hover,
.settings-mobile-actions input.account-action:focus {
  background: #E5E7EB !important;
}

.settings-mobile-actions input[value="Se déconnecter"],
.settings-mobile-actions input[value="Log off"] {
  box-shadow: 0 7px 16px rgba(107, 114, 128, 0.36) !important;
}

.settings-mobile-actions input[value="Se déconnecter"]:hover,
.settings-mobile-actions input[value="Se déconnecter"]:focus,
.settings-mobile-actions input[value="Log off"]:hover,
.settings-mobile-actions input[value="Log off"]:focus {
  box-shadow: 0 9px 20px rgba(107, 114, 128, 0.45) !important;
}

/* Alerte quota : message visible et contacts immédiatement identifiables. */
.booking-conflict-message {
  margin: 1.25rem auto;
  max-width: 58rem;
  padding: 1rem 1.25rem;
  border: 1px solid #F59E0B;
  border-left: 5px solid #D97706;
  border-radius: 0.75rem;
  background: #FFFBEB;
  color: #451A03;
  box-shadow: 0 4px 10px rgba(146, 64, 14, 0.16);
}

.booking-conflict-message h2 {
  margin-top: 0;
  color: #92400E;
}

.booking-conflict-message li.quota-alert {
  margin: 0.5rem 0;
  padding: 0.75rem 1rem;
  border-radius: 0.5rem;
  background: #FEF3C7;
  color: #451A03;
  font-weight: 700;
}

.booking-conflict-message a.quota-contact {
  color: #92400E;
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 2px;
  white-space: nowrap;
}

.booking-conflict-message a.quota-contact:hover,
.booking-conflict-message a.quota-contact:focus {
  color: #78350F;
}

/* Même alerte pour le contrôle AJAX affiché pendant la saisie. */
#policy_details.has-rule-issue {
  border-left: 5px solid #D97706 !important;
  border-radius: 0.75rem !important;
  background: #FFFBEB !important;
  color: #451A03 !important;
  box-shadow: 0 4px 10px rgba(146, 64, 14, 0.16) !important;
  padding: 1rem 1.25rem !important;
}

#policy_details.has-rule-issue p,
#policy_details.has-rule-issue li {
  color: #451A03 !important;
}

#policy_details.has-rule-issue li {
  margin: 0.5rem 0;
  padding: 0.75rem 1rem;
  border-radius: 0.5rem;
  background: #FEF3C7 !important;
  font-weight: 700;
}

/* Restauration de l'aspect historique du bouton Paramètres. */
.banner nav.user-nav details.settings-menu > summary.account-settings-action {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  max-height: 1.75rem !important;
  box-sizing: border-box !important;
  padding: 3px 20px 3px 2em !important;
  border-radius: 20px !important;
  background: #F3F4F6 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%231F2937' stroke-width='2' stroke-linecap='round' d='M12 3v2m0 14v2M3 12h2m14 0h2M5.6 5.6 7 7m10 10 1.4 1.4M18.4 5.6 17 7M7 17l-1.4 1.4'/%3E%3Ccircle cx='12' cy='12' r='4' fill='none' stroke='%231F2937' stroke-width='2'/%3E%3C/svg%3E") no-repeat 0.65em center / 1em 1em !important;
  color: #1F2937 !important;
  font-size: 0.8rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  list-style: none !important;
  cursor: pointer !important;
}

/* Couleur finale des réservations du calendrier. */
.dwm_main .booking_list > div.I,
.dwm_main .booking_list > div.I a {
  background: #F0FDF4 !important;
  color: #166534 !important;
}

/* Mobile : structure stable et sans chevauchement pour la page Quotas. */
@media (max-width: 40rem) {
  .settings-page.quota-page .quota-main-card {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
  }
  .settings-page.quota-page .quota-config-card,
  .settings-page.quota-page .quota-edit-card,
  .settings-page.quota-page .quota-save-actions {
    display: block !important;
    float: none !important;
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
  }
  .settings-page.quota-page .quota-selector {
    display: grid !important;
    float: none !important;
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
  }
  .settings-page.quota-page .quota-stats {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  .settings-page.quota-page .quota-edit-form {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-site-category {
    min-height: 1.75rem !important;
    margin-top: 0.55rem;
    padding: 0.35rem 0.6rem !important;
    border: 1px solid rgba(90, 177, 134, 0.48) !important;
    border-radius: 0.55rem;
    background: linear-gradient(135deg, rgba(233, 250, 242, 0.78), rgba(211, 241, 226, 0.56)) !important;
    color: #267550 !important;
    font-weight: 850 !important;
    cursor: pointer;
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-site-category::after {
    content: "▾";
    margin-left: auto;
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu.site-category-collapsed .settings-submenu-site-mobile {
    display: none !important;
  }
}

/* La page Quotas reste centrée sur ordinateur comme les autres pages de paramètres. */
.settings-page.quota-page {
  width: min(100% - 2rem, 68rem) !important;
  margin-left: auto !important;
  margin-right: auto !important;
  text-align: left !important;
}
.settings-page.quota-page .quota-main-card {
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Présentation finale de la gestion des quotas : parcours en deux étapes. */
.quota-page .quota-main-card {
  display: block !important;
  width: min(100%, 58rem) !important;
  max-width: 58rem !important;
  margin: 0 auto !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.quota-page .quota-page-header {
  margin-bottom: 1.5rem !important;
  padding: 0 0.25rem !important;
}
.quota-page .quota-page-header h1 {
  margin-bottom: 0.35rem !important;
  font-size: 1.55rem !important;
  color: #17324D !important;
}
.quota-page .quota-page-intro {
  max-width: 42rem;
  margin: 0;
  color: #64748B;
  font-size: 0.92rem;
  line-height: 1.5;
}
.quota-page .quota-config-card,
.quota-page .quota-selector,
.quota-page .quota-edit-card {
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 1rem !important;
  padding: 1.25rem 1.5rem !important;
  box-sizing: border-box !important;
  border: 1px solid #D9E5EF !important;
  border-radius: 0.9rem !important;
  background: #FFFFFF !important;
  box-shadow: 0 8px 22px rgba(23, 50, 77, 0.07) !important;
}
.quota-page .quota-config-card { border-left: 4px solid #44BCB4 !important; }
.quota-page .quota-feature-settings h2 {
  margin: 0 0 0.3rem !important;
  font-size: 1rem !important;
}
.quota-page .quota-card-description {
  margin: 0 0 0.8rem;
  color: #64748B;
  font-size: 0.84rem;
}
.quota-page .quota-feature-settings label {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  color: #17324D;
  font-weight: 700;
}
.quota-page .quota-feature-settings input[type="checkbox"] {
  width: 1.05rem;
  height: 1.05rem;
  accent-color: #238B83;
}
.quota-page .quota-search-title {
  margin: 1.5rem 0 0.55rem !important;
  padding: 0 !important;
  border: 0 !important;
  font-size: 1rem !important;
}
.quota-page .quota-selector {
  position: relative;
  align-items: stretch !important;
  justify-self: auto !important;
  background: #F8FBFD !important;
}
.quota-page .quota-selector .quota-step-number,
.quota-page .quota-user-heading .quota-step-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.75rem;
  height: 1.75rem;
  flex: 0 0 1.75rem;
  border-radius: 50%;
  background: #DDF4F1;
  color: #18746E;
  font-size: 0.72rem;
  font-weight: 800;
}
.quota-page .quota-selector .quota-step-number {
  position: absolute;
  top: 1.2rem;
  left: 1.5rem;
}
.quota-page .quota-selector label {
  width: auto !important;
  max-width: none !important;
  margin: 0 0 0.45rem 2.5rem !important;
  color: #17324D;
  font-size: 0.86rem;
}
.quota-page .quota-selector select {
  width: 100% !important;
  max-width: none !important;
  min-height: 2.6rem !important;
  background: #FFFFFF !important;
}
.quota-page .quota-edit-card { margin-top: 0 !important; padding-top: 1.4rem !important; }
.quota-page .quota-user-heading {
  display: flex;
  align-items: center;
  gap: 0.7rem;
  margin-bottom: 1rem;
}
.quota-page .quota-user-heading h3 { margin: 0.1rem 0 0 !important; font-size: 1.12rem !important; }
.quota-page .quota-eyebrow {
  display: block;
  color: #64748B;
  font-size: 0.72rem;
  text-transform: uppercase;
  letter-spacing: 0.06em;
}
.quota-page .quota-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
  margin-bottom: 1.2rem;
}
.quota-page .quota-stat {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.8rem 1rem;
  border: 1px solid #D9E5EF;
  border-radius: 0.65rem;
  background: #F8FBFD;
  color: #536579;
  font-size: 0.82rem;
}
.quota-page .quota-stat strong { color: #3C8CCC; font-size: 1.2rem; }
.quota-page .quota-stat-current { border-color: rgba(68, 188, 180, 0.4); background: #F0FBFA; }
.quota-page .quota-stat-current strong { color: #238B83; }
.quota-page .quota-edit-form {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 12rem !important;
  align-items: center !important;
  gap: 0.45rem 1rem !important;
  padding-top: 1rem;
  border-top: 1px solid #E5EDF3;
}
.quota-page .quota-edit-form label { grid-column: 1; margin: 0 !important; }
.quota-page .quota-edit-form input[type="number"] {
  grid-column: 2;
  grid-row: 1 / span 2;
  min-height: 2.6rem !important;
}
.quota-page .quota-edit-form small {
  grid-column: 1;
  color: #64748B;
  font-size: 0.76rem;
  line-height: 1.4;
}
.quota-page .quota-save-actions { margin: 1rem 0 0 !important; text-align: right; }
.quota-page .quota-save-bottom {
  min-height: 2.5rem !important;
  padding: 0.65rem 1.4rem !important;
  border: 0 !important;
  border-radius: 0.6rem !important;
  background: #238B83 !important;
  color: #FFFFFF !important;
  font-weight: 700 !important;
}
.quota-page .quota-save-bottom:hover,
.quota-page .quota-save-bottom:focus { background: #176B67 !important; }
@media (max-width: 40rem) {
  .quota-page .quota-config-card,
  .quota-page .quota-selector,
  .quota-page .quota-edit-card { padding: 1rem !important; }
  .quota-page .quota-selector {
    padding-top: 3.15rem !important;
  }
  .quota-page .quota-selector .quota-step-number {
    top: 1rem;
    left: 1rem;
  }
  .quota-page .quota-selector label {
    margin-left: 0 !important;
    line-height: 1.35;
  }
  .quota-page .quota-stats { grid-template-columns: 1fr; }
  .quota-page .quota-edit-form { grid-template-columns: 1fr !important; }
  .quota-page .quota-edit-form input[type="number"] { grid-column: 1; grid-row: auto; }
  .quota-page .quota-edit-form small { grid-column: 1; }
  .quota-page .quota-save-actions { text-align: left; }
}

/* Dernière priorité pour la page Quotas. */
.settings-page.quota-page {
  width: min(100% - 2rem, 64rem) !important;
  max-width: none !important;
  margin: 2rem auto !important;
}
.quota-page .quota-main-card {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 1rem !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.quota-page .quota-page-header,
.quota-page .quota-config-card,
.quota-page .quota-search-title { grid-column: 1 / -1 !important; }
.quota-page .quota-config-card,
.quota-page .quota-selector,
.quota-page .quota-edit-card {
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 1.25rem !important;
  border: 1px solid #D9E3EC !important;
  border-radius: 0.9rem !important;
  background: #FFFFFF !important;
  box-shadow: 0 8px 24px rgba(22, 50, 79, 0.08) !important;
}
.quota-page .quota-settings-form {
  display: grid !important;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr) auto !important;
  align-items: end !important;
  gap: 1rem !important;
}
.quota-page .quota-feature-settings,
.quota-page .quota-message-settings {
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.quota-page input[type="email"],
.quota-page input[type="search"],
.quota-page input[type="number"] {
  width: 100% !important;
  min-height: 2.65rem !important;
  box-sizing: border-box !important;
  padding: 0.65rem 0.8rem !important;
  border: 1px solid #C8D5E1 !important;
  border-radius: 0.6rem !important;
  background: #FFFFFF !important;
  color: #16324F !important;
  box-shadow: none !important;
}
.quota-page .quota-settings-form > button,
.quota-page .quota-edit-form > button {
  min-height: 2.65rem !important;
  padding: 0.65rem 1rem !important;
  border: 0 !important;
  border-radius: 0.6rem !important;
  background: #176B87 !important;
  color: #FFFFFF !important;
  font-weight: 700 !important;
  cursor: pointer !important;
}
.quota-page .quota-search-title {
  margin: 0 !important;
  color: #16324F !important;
  font-size: 0.95rem !important;
  font-weight: 750 !important;
}
.quota-page .quota-edit-form {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: end !important;
  gap: 0.75rem !important;
}
.quota-page .quota-edit-form label {
  grid-column: 1 / -1 !important;
  margin: 0 !important;
  color: #16324F !important;
  font-weight: 700 !important;
}
.quota-page .quota-selector {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 0.6rem !important;
  justify-self: center !important;
  width: min(100%, 34rem) !important;
}
.quota-page .quota-selector label,
.quota-page .quota-selector select {
  width: 100% !important;
  max-width: 30rem !important;
}
.quota-page .quota-selector label {
  color: #16324F !important;
  font-weight: 700 !important;
  text-align: left !important;
}
@media (max-width: 44rem) {
  .settings-page.quota-page { width: min(100% - 1rem, 64rem) !important; margin: 1rem auto !important; }
  .quota-page .quota-main-card { grid-template-columns: 1fr !important; gap: 0.75rem !important; }
  .quota-page .quota-settings-form,
  .quota-page .quota-edit-form { grid-template-columns: 1fr !important; gap: 0.85rem !important; }
  .quota-page .quota-config-card,
  .quota-page .quota-page-header,
  .quota-page .quota-search-title { grid-column: 1 !important; }
  .quota-page .quota-settings-form > button,
  .quota-page .quota-edit-form > button { width: 100% !important; }
}

/* Priorité finale : rendu quotas clair, professionnel et responsive. */
.settings-page.quota-page {
  width: min(100% - 2rem, 64rem) !important;
  max-width: none !important;
  margin: 2rem auto !important;
}

.quota-page .quota-main-card {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 1rem !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.quota-page .quota-page-header,
.quota-page .quota-config-card,
.quota-page .quota-search-title {
  grid-column: 1 / -1 !important;
}

.quota-page .quota-page-header {
  margin: 0 0 0.35rem !important;
  padding: 0 0 0.85rem !important;
  border-bottom: 1px solid #D9E3EC !important;
}

.quota-page .quota-page-header h1 {
  margin: 0 !important;
  color: #16324F !important;
  font-size: clamp(1.35rem, 2.4vw, 1.8rem) !important;
  font-weight: 750 !important;
}

.quota-page .quota-config-card,
.quota-page .quota-selector,
.quota-page .quota-edit-card {
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 1.25rem !important;
  border: 1px solid #D9E3EC !important;
  border-radius: 0.9rem !important;
  background: #FFFFFF !important;
  box-shadow: 0 8px 24px rgba(22, 50, 79, 0.08) !important;
}

.quota-page .quota-settings-form {
  display: grid !important;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr) auto !important;
  align-items: end !important;
  gap: 1rem !important;
}

.quota-page .quota-feature-settings,
.quota-page .quota-message-settings {
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.quota-page .quota-feature-settings h2,
.quota-page .quota-message-settings h3,
.quota-page .quota-search-title {
  color: #16324F !important;
  font-weight: 750 !important;
}

.quota-page .quota-feature-settings h2,
.quota-page .quota-message-settings h3 {
  margin: 0 0 0.55rem !important;
  font-size: 0.8rem !important;
}

.quota-page .quota-feature-settings > label {
  min-height: 2.65rem !important;
  display: flex !important;
  align-items: center !important;
  gap: 0.55rem !important;
  box-sizing: border-box !important;
  padding: 0.7rem 0.8rem !important;
  border: 1px solid #D9E3EC !important;
  border-radius: 0.6rem !important;
  background: #F7FAFC !important;
  color: #243447 !important;
}

.quota-page input[type="email"],
.quota-page input[type="search"],
.quota-page input[type="number"] {
  width: 100% !important;
  min-height: 2.65rem !important;
  box-sizing: border-box !important;
  padding: 0.65rem 0.8rem !important;
  border: 1px solid #C8D5E1 !important;
  border-radius: 0.6rem !important;
  background: #FFFFFF !important;
  color: #16324F !important;
  box-shadow: none !important;
}

.quota-page input:focus {
  border-color: #2F80A8 !important;
  outline: 3px solid rgba(47, 128, 168, 0.16) !important;
  outline-offset: 1px !important;
}

.quota-page .quota-settings-form > button,
.quota-page .quota-edit-form > button {
  min-height: 2.65rem !important;
  padding: 0.65rem 1rem !important;
  border: 0 !important;
  border-radius: 0.6rem !important;
  background: #176B87 !important;
  color: #FFFFFF !important;
  font-weight: 700 !important;
  cursor: pointer !important;
}

.quota-page .quota-search-title {
  margin: 0 !important;
  font-size: 0.95rem !important;
}

.quota-page .quota-edit-card h3 {
  margin: 0 0 0.85rem !important;
  color: #16324F !important;
  font-size: 1.05rem !important;
}

.quota-page .quota-current-month {
  margin: 0 0 1rem !important;
  padding: 0.7rem 0.8rem !important;
  border: 1px solid #D7E5F1 !important;
  border-radius: 0.6rem !important;
  background: #F3F8FC !important;
}
.quota-page .quota-total-bookings {
  margin: 0 0 0.55rem !important;
  color: #536579 !important;
}

.quota-page .quota-result-value {
  color: #176B87 !important;
  font-weight: 800 !important;
}

.quota-page .quota-edit-form {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: end !important;
  gap: 0.75rem !important;
}

.quota-page .quota-edit-form label {
  grid-column: 1 / -1 !important;
  margin: 0 !important;
  color: #16324F !important;
  font-weight: 700 !important;
}

@media (max-width: 44rem) {
  .settings-page.quota-page {
    width: min(100% - 1rem, 64rem) !important;
    margin: 1rem auto !important;
  }

  .quota-page .quota-main-card {
    grid-template-columns: 1fr !important;
    gap: 0.75rem !important;
  }

  .quota-page .quota-settings-form,
  .quota-page .quota-edit-form {
    grid-template-columns: 1fr !important;
    gap: 0.85rem !important;
  }

  .quota-page .quota-config-card,
  .quota-page .quota-page-header,
  .quota-page .quota-search-title {
    grid-column: 1 !important;
  }

  .quota-page .quota-settings-form > button,
  .quota-page .quota-edit-form > button {
    width: 100% !important;
  }
}

/* Présentation moderne et responsive de la page des quotas. */
.settings-page.quota-page {
  width: min(100% - 2rem, 64rem) !important;
  margin: 2rem auto !important;
  color: #243447 !important;
}

.quota-page .quota-main-card {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.quota-page .quota-page-header,
.quota-page .quota-config-card,
.quota-page .quota-search-title {
  grid-column: 1 / -1;
}

.quota-page .quota-page-header {
  margin: 0 0 0.35rem !important;
  padding: 0 0 0.85rem !important;
  border-bottom: 1px solid #D9E3EC !important;
}

.quota-page .quota-page-header h1 {
  margin: 0 !important;
  color: #16324F !important;
  font-size: clamp(1.35rem, 2.4vw, 1.8rem) !important;
  font-weight: 750 !important;
  letter-spacing: -0.02em;
}

.quota-page .quota-config-card,
.quota-page .quota-selector,
.quota-page .quota-edit-card {
  box-sizing: border-box;
  margin: 0 !important;
  padding: 1.25rem !important;
  border: 1px solid #D9E3EC !important;
  border-radius: 0.9rem !important;
  background: #FFFFFF !important;
  box-shadow: 0 8px 24px rgba(22, 50, 79, 0.08) !important;
}

.quota-page .quota-config-card {
  grid-column: 1 / -1;
}

.quota-page .quota-settings-form {
  display: grid;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr) auto;
  align-items: end;
  gap: 1rem;
}

.quota-page .quota-feature-settings,
.quota-page .quota-message-settings {
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.quota-page .quota-feature-settings h2,
.quota-page .quota-message-settings h3 {
  margin: 0 0 0.55rem !important;
  color: #16324F !important;
  font-size: 0.8rem !important;
  font-weight: 750 !important;
}

.quota-page .quota-feature-settings > label {
  min-height: 2.65rem;
  box-sizing: border-box;
  display: flex !important;
  align-items: center;
  gap: 0.6rem;
  padding: 0.7rem 0.8rem;
  border: 1px solid #D9E3EC;
  border-radius: 0.6rem;
  background: #F7FAFC;
  color: #243447;
  font-weight: 650;
}

.quota-page input[type="email"],
.quota-page input[type="search"],
.quota-page input[type="number"] {
  width: 100%;
  min-height: 2.65rem !important;
  box-sizing: border-box;
  padding: 0.65rem 0.8rem !important;
  border: 1px solid #C8D5E1 !important;
  border-radius: 0.6rem !important;
  background: #FFFFFF !important;
  color: #16324F !important;
  font-size: 0.9rem !important;
  box-shadow: none !important;
}

.quota-page input:focus {
  border-color: #2F80A8 !important;
  outline: 3px solid rgba(47, 128, 168, 0.16) !important;
  outline-offset: 1px;
}

.quota-page .quota-settings-form > button,
.quota-page .quota-edit-form > button {
  min-height: 2.65rem;
  padding: 0.65rem 1rem !important;
  border: 0 !important;
  border-radius: 0.6rem !important;
  background: #176B87 !important;
  color: #FFFFFF !important;
  font-weight: 700 !important;
  cursor: pointer;
  box-shadow: 0 5px 12px rgba(23, 107, 135, 0.2) !important;
}

.quota-page .quota-settings-form > button:hover,
.quota-page .quota-edit-form > button:hover,
.quota-page .quota-settings-form > button:focus,
.quota-page .quota-edit-form > button:focus {
  background: #12566D !important;
}

.quota-page .quota-search-title {
  margin: 0 !important;
  color: #16324F !important;
  font-size: 0.95rem !important;
  font-weight: 750 !important;
}

.quota-page .quota-selector {
  display: block !important;
}

.quota-page .quota-edit-card {
  display: block;
}

.quota-page .quota-edit-card h3 {
  margin: 0 0 0.85rem !important;
  color: #16324F !important;
  font-size: 1.05rem !important;
}

.quota-page .quota-current-month {
  margin: 0 0 1rem !important;
  padding: 0.7rem 0.8rem !important;
  border: 1px solid #D7E5F1 !important;
  border-radius: 0.6rem !important;
  background: #F3F8FC !important;
}

.quota-page .quota-result-value {
  color: #176B87 !important;
  font-weight: 800 !important;
}

.quota-page .quota-edit-form {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: end;
  gap: 0.75rem;
}

.quota-page .quota-edit-form label {
  grid-column: 1 / -1;
  margin: 0 !important;
  color: #16324F !important;
  font-size: 0.8rem !important;
  font-weight: 700 !important;
}

@media (max-width: 44rem) {
  .settings-page.quota-page {
    width: min(100% - 1rem, 64rem) !important;
    margin: 1rem auto !important;
  }

  .quota-page .quota-main-card {
    grid-template-columns: 1fr;
    gap: 0.75rem;
  }

  .quota-page .quota-settings-form {
    grid-template-columns: 1fr;
    gap: 0.85rem;
  }

  .quota-page .quota-config-card,
  .quota-page .quota-page-header,
  .quota-page .quota-search-title {
    grid-column: 1;
  }

  .quota-page .quota-settings-form > button,
  .quota-page .quota-edit-form > button {
    width: 100%;
  }

  .quota-page .quota-edit-form {
    grid-template-columns: 1fr;
  }
}

/* Présentation finale de la page Quotas utilisateurs. */
.quota-page {
  width: min(100% - 2rem, 68rem) !important;
  max-width: 68rem !important;
  margin: 1.5rem auto 2rem !important;
  color: #243447 !important;
}

.quota-main-card {
  display: block;
  width: min(100%, 44rem);
  max-width: 44rem;
  margin: 0 auto !important;
  padding: 0.9rem 1rem 1rem;
  box-sizing: border-box;
  border: 1px solid #DCE7F2;
  border-radius: 0.8rem;
  background: #FFFFFF;
  box-shadow: 0 6px 16px rgba(23, 50, 77, 0.08);
}

.quota-page-header {
  margin-bottom: 0.8rem;
  padding: 0.35rem 0.2rem 0.7rem;
  border-bottom: 1px solid #E2E8F0;
}

.quota-page-kicker {
  margin-bottom: 0.15rem;
  color: #0F766E;
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.quota-page-header h1 {
  margin: 0;
  color: #17324D;
  font-size: 1.15rem;
  line-height: 1.2;
}

.quota-page-header p {
  max-width: 46rem;
  margin: 0.25rem 0 0;
  color: #536579;
  font-size: 0.76rem;
}

.quota-config-card {
  width: 100%;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.quota-page .quota-feature-settings,
.quota-page .quota-message-settings {
  width: auto;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.quota-page .quota-message-settings {
  margin-top: 0.8rem;
  padding-top: 0.8rem;
  border-top: 1px solid #E2E8F0;
}

.quota-page .quota-feature-settings h2,
.quota-page .quota-message-settings h3 {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0 0 0.55rem;
  color: #17324D;
  font-size: 0.84rem;
}

.quota-page .quota-feature-settings h2::before,
.quota-page .quota-message-settings h3::before {
  content: '';
  display: inline-block;
  width: 1rem;
  height: 1rem;
  flex: 0 0 1rem;
  border-radius: 0.35rem;
  background: #E6F6F2 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%230F766E' stroke-width='2' stroke-linecap='round' d='M4 19V5m0 14h16M8 16v-5m4 5V7m4 9v-8m4 8V4'/%3E%3C/svg%3E") center / 0.85rem no-repeat;
}

.quota-page .quota-message-settings h3::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%230F766E' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M4 5h16v11H8l-4 4zM8 9h8M8 12h5'/%3E%3C/svg%3E");
}

.quota-page .quota-selector button,
.quota-page .quota-edit-form button {
  border: 0;
  border-radius: 0.55rem;
  background: #0F766E;
  color: #FFFFFF;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 5px 12px rgba(15, 118, 110, 0.2);
}

.quota-page .quota-selector button:hover,
.quota-page .quota-edit-form button:hover {
  background: #115E59;
}

.quota-page .quota-settings-form > button {
  display: block;
  margin: 0.75rem 0 0 auto;
  padding: 0.45rem 0.9rem;
  border: 0;
  border-radius: 0.55rem;
  background: #0F766E;
  color: #FFFFFF;
  font-weight: 700;
  cursor: pointer;
  box-shadow: 0 5px 12px rgba(15, 118, 110, 0.2);
}

.quota-page .quota-settings-form > button:hover,
.quota-page .quota-settings-form > button:focus {
  background: #115E59;
}

.quota-page .quota-feature-settings > label {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  color: #17324D;
  font-weight: 700;
}

.quota-page .quota-feature-settings > .quota-feature-note {
  display: block;
  margin-top: 0.25rem;
}

.quota-page .quota-selector input[type="search"],
.quota-page .quota-selector select,
.quota-page .quota-edit-form input[type="number"] {
  min-height: 2.25rem;
  border-color: #C7D5E2;
  border-radius: 0.55rem;
  box-shadow: inset 0 1px 2px rgba(23, 50, 77, 0.04);
}

.quota-page .quota-selector {
  margin-top: 0.85rem;
  width: 100%;
  margin-left: 0;
  margin-right: 0;
  padding: 0.85rem 0 0;
  border: 0;
  border-top: 1px solid #E2E8F0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.quota-page .quota-selector fieldset {
  border: 0;
  padding: 0;
}

.quota-page .quota-selector legend {
  margin-bottom: 0.5rem;
  color: #17324D;
  font-size: 0.86rem;
  font-weight: 800;
}

.quota-page .quota-edit-card {
  margin-top: 0.85rem;
  width: 100%;
  margin-left: 0;
  margin-right: 0;
  padding: 0.85rem 0 0;
  border: 0;
  border-top: 1px solid #E2E8F0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

@media (max-width: 46rem) {
  .quota-page {
    width: min(100% - 1rem, 68rem) !important;
    margin-top: 0.75rem !important;
  }

  .quota-main-card {
    padding: 0.75rem;
  }

}

/* Icône du bouton de déconnexion extérieur au menu utilisateur. */
.banner nav.user-nav > form > input[value="Se déconnecter"],
.banner nav.user-nav > form > input[value="Log off"] {
  padding-left: 2.1em !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%231F2937' stroke-width='2' d='M10 5H5v14h5M14 8l4 4-4 4M9 12h9'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: 0.7em center !important;
  background-size: 1em 1em !important;
}

/* Le bouton Accueil reste visible sur ordinateur. */
@media (min-width: 58.01rem) {
  .banner nav.user-nav > a.menu-home,
  .banner nav.user-nav > a.menu-home.admin-home {
    display: inline-flex !important;
  }

  .banner nav.user-nav > a.menu-home::before {
    content: '';
    display: inline-block;
    width: 1em;
    height: 1em;
    margin-right: 0.45em;
    flex: 0 0 1em;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%231F2937' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='m3 11 9-8 9 8v9a1 1 0 0 1-1 1h-5v-6H9v6H4a1 1 0 0 1-1-1z'/%3E%3C/svg%3E") center / contain no-repeat;
  }

  .banner nav.user-nav > a.quick-add-booking::before {
    content: '';
    display: inline-block;
    width: 1em;
    height: 1em;
    margin-right: 0.45em;
    flex: 0 0 1em;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='5' width='18' height='16' rx='2' fill='none' stroke='%230F766E' stroke-width='2'/%3E%3Cpath fill='none' stroke='%230F766E' stroke-width='2' stroke-linecap='round' d='M8 3v4M16 3v4M3 10h18M12 13v5M9.5 15.5h5'/%3E%3C/svg%3E") center / contain no-repeat;
  }
}

/* Sur mobile, le bouton Paramètres devient « Plus ... ». */
@media (max-width: 58rem) {
  .banner nav.user-nav details.settings-menu > summary.account-settings-action .settings-label {
    display: none !important;
  }

  .banner nav.user-nav details.settings-menu > summary.account-settings-action::after {
    content: 'Plus ...';
  }
}

/* Priorité finale : mêmes ombres que le bouton Paramètres. */
.banner nav.user-nav a.menu-home,
.banner nav.user-nav a.quick-add-booking,
.banner nav.user-nav span.quota-status,
.banner nav.user-nav a.connected-user,
.banner .company > a.button[href="edit_entry.php"] {
  box-shadow: 0 7px 16px rgba(107, 114, 128, 0.36) !important;
}

.banner nav.user-nav a.menu-home:hover,
.banner nav.user-nav a.menu-home:focus,
.banner nav.user-nav a.quick-add-booking:hover,
.banner nav.user-nav a.quick-add-booking:focus,
.banner nav.user-nav span.quota-status:hover,
.banner nav.user-nav span.quota-status:focus,
.banner nav.user-nav a.connected-user:hover,
.banner nav.user-nav a.connected-user:focus,
.banner .company > a.button[href="edit_entry.php"]:hover,
.banner .company > a.button[href="edit_entry.php"]:focus {
  box-shadow: 0 9px 20px rgba(107, 114, 128, 0.45) !important;
}

/* Priorité finale : mêmes ombres que le bouton Paramètres. */
.banner nav.user-nav a.menu-home,
.banner nav.user-nav a.quick-add-booking,
.banner nav.user-nav span.quota-status,
.banner nav.user-nav a.connected-user,
.banner .company > a.button[href="edit_entry.php"] {
  box-shadow: 0 7px 16px rgba(107, 114, 128, 0.36) !important;
}

.banner nav.user-nav a.menu-home:hover,
.banner nav.user-nav a.menu-home:focus,
.banner nav.user-nav a.quick-add-booking:hover,
.banner nav.user-nav a.quick-add-booking:focus,
.banner nav.user-nav span.quota-status:hover,
.banner nav.user-nav span.quota-status:focus,
.banner nav.user-nav a.connected-user:hover,
.banner nav.user-nav a.connected-user:focus,
.banner .company > a.button[href="edit_entry.php"]:hover,
.banner .company > a.button[href="edit_entry.php"]:focus {
  box-shadow: 0 9px 20px rgba(107, 114, 128, 0.45) !important;
}

/* Les boutons principaux du compte reprennent exactement l'ombre de Paramètres. */
.banner nav.user-nav a.menu-home,
.banner nav.user-nav a.quick-add-booking,
.banner nav.user-nav span.quota-status,
.banner nav.user-nav a.connected-user,
.banner .company > a.button[href="edit_entry.php"] {
  box-shadow: 0 7px 16px rgba(107, 114, 128, 0.36) !important;
  filter: none !important;
}

.banner nav.user-nav a.menu-home:hover,
.banner nav.user-nav a.menu-home:focus,
.banner nav.user-nav a.quick-add-booking:hover,
.banner nav.user-nav a.quick-add-booking:focus,
.banner nav.user-nav span.quota-status:hover,
.banner nav.user-nav span.quota-status:focus,
.banner nav.user-nav a.connected-user:hover,
.banner nav.user-nav a.connected-user:focus,
.banner .company > a.button[href="edit_entry.php"]:hover,
.banner .company > a.button[href="edit_entry.php"]:focus {
  box-shadow: 0 9px 20px rgba(107, 114, 128, 0.45) !important;
}

/* Mobile : le bouton du nom connecté doit suivre le texte, sans largeur
 * extensible dans la ligne du menu. */
@media (max-width: 58rem) {
  .banner nav.user-nav a.connected-user {
    flex: 0 0 auto !important;
    width: fit-content !important;
    max-width: 9rem !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
}

/* Le titre Ajouter une réservation reprend le style du titre des rapports. */
.edit_entry form.standard#main > fieldset > legend {
  display: block;
  box-sizing: border-box;
  margin: 0.55rem 0 0.65rem !important;
  padding: 0.35rem 0.6rem;
  border-left: 3px solid #3C8CCC;
  border-radius: 0.35rem;
  background: #F3F4F6;
  color: #17324D !important;
  font-size: 0.95rem !important;
  font-weight: 700 !important;
  line-height: 1.2;
}

/* Formulaire de réservation sur PC : le dégradé doit couvrir tout le formulaire,
 * et non seulement la largeur de son contenu. */
@media (min-width: 58.01rem) {
  .edit_entry form.standard#main {
    float: none !important;
    width: fit-content !important;
    max-width: calc(100% - 2rem) !important;
    margin: 2rem auto 0 !important;
  }

.edit_entry form.standard#main::after {
    content: "";
    display: table;
    clear: both;
  }

  /* Le rapport de réservations contient lui aussi des fieldsets flottants. */
  #report_form::after {
    content: "";
    display: table;
    clear: both;
  }
}

/* Stabilise le sous-menu lorsque le nom connecté est long. */
.banner nav.user-nav details.settings-menu {
  flex: 0 0 auto !important;
}

.banner nav.user-nav a.connected-user {
  min-width: 0 !important;
  max-width: 16rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (min-width: 58.01rem) {
  .banner nav.user-nav a.connected-user {
    flex: 0 1 auto !important;
    width: auto !important;
    max-width: 12rem !important;
  }
}

.banner nav.user-nav {
  align-items: center !important;
  flex-wrap: nowrap !important;
}

.banner nav.user-nav details.settings-menu,
.banner nav.user-nav a.connected-user,
.banner nav.user-nav > span.quota-status,
.banner nav.user-nav > form {
  align-self: center !important;
  white-space: nowrap !important;
  vertical-align: middle !important;
}

@media (max-width: 58rem) {
  .banner nav.user-nav {
    align-items: center !important;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    overflow-x: hidden !important;
    gap: 0.5rem !important;
  }

  .banner nav.user-nav details.settings-menu,
  .banner nav.user-nav a.connected-user,
  .banner nav.user-nav > span.quota-status,
  .banner nav.user-nav > form {
    align-self: center !important;
    height: 1.75rem !important;
    min-height: 1.75rem !important;
    max-height: 1.75rem !important;
    flex: 0 0 auto !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    vertical-align: middle !important;
  }

  .banner nav.user-nav details.settings-menu > summary.account-settings-action {
    display: inline-flex !important;
    align-items: center !important;
    height: 1.75rem !important;
    min-height: 1.75rem !important;
    max-height: 1.75rem !important;
    margin: 0 !important;
    line-height: 1 !important;
    vertical-align: middle !important;
  }

  .banner nav.user-nav a.connected-user {
    flex: 1 1 auto !important;
    width: auto !important;
    max-width: calc(100vw - 12rem) !important;
    min-width: 0 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
  }

  .banner nav.user-nav a.connected-user {
    flex: 0 0 auto !important;
    width: fit-content !important;
    max-width: 9rem !important;
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
}

/* Priorité finale : nom de l'administrateur connecté en rouge. */
.banner nav.user-nav a.connected-user.admin-connected-user,
.banner nav.user-nav a.connected-user.admin-connected-user:hover,
.banner nav.user-nav a.connected-user.admin-connected-user:focus {
  color: #B91C1C !important;
}

/* Modernisation professionnelle des formulaires. */
form.standard,
.settings-page .quota-selector,
.settings-page .quota-edit-card {
  color: #17324D;
  background: linear-gradient(135deg, #EAF4FC 0%, #F2EEFF 50%, #F0FDF4 100%);
  border: 1px solid #D9E2EC;
  border-radius: 14px;
  box-shadow: 0 10px 26px rgba(23, 50, 77, 0.10);
}

form.standard {
  padding: 1.25rem;
  font-size: 0.85rem;
  line-height: 1.45;
}

form.standard label,
form.standard p,
form.standard li,
.settings-page .quota-selector label,
.settings-page .quota-edit-form label {
  font-size: 0.85rem;
  line-height: 1.45;
}

form.standard > fieldset,
form.standard fieldset fieldset {
  border: 1px solid #E2E8F0;
  border-radius: 12px;
  background: #F8FAFC;
  padding: 1rem;
}

form.standard > fieldset > legend,
form.standard fieldset fieldset > legend {
  color: #17324D;
  font-size: 0.9rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  padding: 0 0.45rem;
}

form.standard > fieldset > fieldset,
form.standard > fieldset > div > fieldset {
  margin-top: 0.85rem;
}

form.standard > fieldset > div > label,
form.standard fieldset fieldset > div > label,
.settings-page .quota-selector label,
.settings-page .quota-edit-form label {
  color: #334E68;
  font-weight: 600;
}

form.standard input[type="text"],
form.standard input[type="email"],
form.standard input[type="password"],
form.standard input[type="search"],
form.standard input[type="number"],
form.standard input[type="date"],
form.standard input[type="time"],
form.standard select,
form.standard textarea,
.settings-page .quota-selector input,
.settings-page .quota-selector select,
.settings-page .quota-edit-form input {
  min-height: 2.35rem;
  box-sizing: border-box;
  border: 1px solid #B8C7D6;
  border-radius: 10px;
  background: #FFFFFF;
  color: #17324D;
  font: inherit;
  padding: 0.45rem 0.7rem;
  transition: border-color 160ms ease, box-shadow 160ms ease;
}

form.standard textarea {
  min-height: 5.5rem;
  resize: vertical;
}

form.standard input::placeholder,
form.standard textarea::placeholder,
.settings-page input::placeholder {
  color: #829AB1;
  opacity: 1;
}

form.standard input:disabled,
form.standard select:disabled,
form.standard textarea:disabled,
.settings-page input:disabled,
.settings-page select:disabled,
.settings-page textarea:disabled {
  background: #EEF2F6;
  color: #829AB1;
  cursor: not-allowed;
}

form.standard input[type="text"]:focus,
form.standard input[type="email"]:focus,
form.standard input[type="password"]:focus,
form.standard input[type="search"]:focus,
form.standard input[type="number"]:focus,
form.standard input[type="date"]:focus,
form.standard input[type="time"]:focus,
form.standard select:focus,
form.standard textarea:focus,
.settings-page .quota-selector input:focus,
.settings-page .quota-selector select:focus,
.settings-page .quota-edit-form input:focus {
  border-color: #3C8CCC;
  outline: 0;
  box-shadow: 0 0 0 3px rgba(60, 140, 204, 0.18);
}

form.standard input[type="submit"],
form.standard input[type="button"],
form.standard button,
.settings-page .quota-selector button,
.settings-page .quota-edit-form button {
  min-height: 2.35rem;
  border: 1px solid #2F80B7;
  border-radius: 10px;
  background: #3C8CCC;
  color: #FFFFFF;
  cursor: pointer;
  font: inherit;
  font-weight: 700;
  padding: 0.45rem 1rem;
  box-shadow: 0 4px 10px rgba(23, 50, 77, 0.16);
  transition: background-color 160ms ease, box-shadow 160ms ease, transform 160ms ease;
}

form.standard input[type="submit"]:hover,
form.standard input[type="submit"]:focus,
form.standard input[type="button"]:hover,
form.standard input[type="button"]:focus,
form.standard button:hover,
form.standard button:focus,
.settings-page .quota-selector button:hover,
.settings-page .quota-selector button:focus,
.settings-page .quota-edit-form button:hover,
.settings-page .quota-edit-form button:focus {
  background: #256FA3;
  box-shadow: 0 7px 16px rgba(23, 50, 77, 0.24);
  transform: translateY(-1px);
}

form.standard input[type="checkbox"],
form.standard input[type="radio"] {
  accent-color: #3C8CCC;
}

form.standard .submit_buttons,
form.standard fieldset:last-child > div:last-child {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.65rem;
  margin-top: 1rem;
}

form.standard :focus-visible,
.settings-page form :focus-visible {
  outline: 3px solid rgba(60, 140, 204, 0.25);
  outline-offset: 2px;
}

@media (max-width: 40rem) {
  form.standard {
    padding: 0.8rem;
    border-radius: 10px;
  }

  form.standard > fieldset,
  form.standard fieldset fieldset {
    padding: 0.75rem;
  }
}

/* Formulaire de connexion centré sur ordinateur. */
@media (min-width: 58.01rem) {
  form.standard#logon {
    float: none;
    width: fit-content;
    margin: 2rem auto 0;
  }

  form.standard#logon > fieldset {
    float: none;
    margin: 0 auto;
  }

  form.standard:not(#logon) {
    float: none;
    width: fit-content;
    max-width: calc(100% - 2rem);
    margin-left: auto;
    margin-right: auto;
  }

  .settings-page.quota-page {
    max-width: none !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: left;
  }

  .quota-page .page-title,
  .quota-page .quota-edit-card,
  .quota-page .quota-help-title,
  .quota-page .quota-help {
    width: fit-content !important;
    max-width: calc(100% - 2rem) !important;
    box-sizing: border-box;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .quota-page .quota-selector {
    width: min(calc(100% - 2rem), 34rem) !important;
    max-width: 34rem !important;
    box-sizing: border-box;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .quota-page .quota-selector select {
    min-width: 20rem;
  }

  .quota-page .quota-selector > fieldset > div {
    display: grid !important;
    grid-template-columns: max-content minmax(14rem, 1fr) max-content;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: nowrap !important;
  }

  .quota-page .quota-selector input[type="search"],
  .quota-page .quota-selector select {
    width: 14rem !important;
    min-width: 0;
  }

  .quota-page .quota-selector input[type="search"] {
    width: 14rem !important;
  }

  .quota-page > h2.page-title {
    border-left: 0 !important;
    text-align: center !important;
  }
}

/* Fond violet clair du bouton de l'utilisateur connecté. */
.banner nav.user-nav a.connected-user,
.banner nav.user-nav a.connected-user:hover,
.banner nav.user-nav a.connected-user:focus {
  background-color: #EDE9FE !important;
  color: #37306B !important;
}

/* Le nom de l'administrateur connecté est affiché en rouge. */
.banner nav.user-nav a.connected-user.admin-connected-user,
.banner nav.user-nav a.connected-user.admin-connected-user:hover,
.banner nav.user-nav a.connected-user.admin-connected-user:focus {
  color: #B91C1C !important;
}

/* Le bouton Quota reprend un bleu clair. */
.banner nav.user-nav > span.quota-status,
.banner nav.user-nav > span.quota-status:hover,
.banner nav.user-nav > span.quota-status:focus {
  background-color: #D7ECFA !important;
  color: #17324D !important;
}

/* Version compacte : l'alerte reste informative sans prendre trop de place. */
.booking-conflict-message,
#schedule_details.has-conflict,
#policy_details.has-rule-issue {
  max-width: 42rem;
  padding: 0.4rem 0.6rem !important;
  border-left-width: 2px !important;
  border-radius: 0.35rem !important;
  box-shadow: 0 1px 4px rgba(146, 64, 14, 0.10) !important;
  font-size: 0.72rem !important;
}

/* Titres principaux harmonisés pour les pages de gestion. */
.page-title {
  box-sizing: border-box;
  margin: 0.9rem 0 1rem !important;
  padding: 0.55rem 0.8rem;
  border-left: 4px solid #3C8CCC;
  border-radius: 0.45rem;
  background: #F3F4F6;
  color: #17324D !important;
  font-size: 1.15rem !important;
  font-weight: 700 !important;
  line-height: 1.2;
}

.page-title {
  margin: 0.7rem 0 0.8rem !important;
  padding: 0.45rem 0.7rem;
  font-size: 1.05rem !important;
}

.page-title {
  margin: 0.55rem 0 0.65rem !important;
  padding: 0.35rem 0.6rem;
  border-left-width: 3px;
  font-size: 0.95rem !important;
}

/* Le titre du formulaire Rapport reprend le même aspect que les autres titres. */
#report_form > fieldset > legend {
  display: block;
  box-sizing: border-box;
  margin: 0.55rem 0 0.65rem !important;
  padding: 0.35rem 0.6rem;
  border-left: 3px solid #3C8CCC;
  border-radius: 0.35rem;
  background: #F3F4F6;
  color: #17324D !important;
  font-size: 0.95rem !important;
  font-weight: 700 !important;
  line-height: 1.2;
}

/* Le formulaire Quotas reprend exactement la structure du formulaire Rapport. */
.quota-page .quota-selector > fieldset {
  display: table;
  float: none;
  width: 100%;
  box-sizing: border-box;
  margin: 0;
}

.quota-page .quota-selector > fieldset > legend {
  display: block;
  box-sizing: border-box;
  margin: 0.55rem 0 0.65rem !important;
  padding: 0.35rem 0.6rem;
  border-left: 3px solid #3C8CCC;
  border-radius: 0.35rem;
  background: #F3F4F6;
  color: #17324D !important;
  font-size: 0.95rem !important;
  font-weight: 700 !important;
  line-height: 1.2;
}

.quota-page .quota-selector > fieldset > div {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.quota-page h2.page-title {
  margin: 0.55rem 0 0.65rem !important;
  padding: 0.35rem 0.6rem !important;
  border-left-width: 3px !important;
  font-size: 0.95rem !important;
  line-height: 1.2 !important;
}

.booking-conflict-message h2 {
  margin: 0 0 0.25rem;
  font-size: 0.82rem !important;
}

.booking-conflict-message li,
#schedule_details.has-conflict li,
#policy_details.has-rule-issue li {
  margin: 0.15rem 0;
  padding: 0.3rem 0.45rem;
  border-radius: 0.25rem;
  font-size: 0.72rem !important;
}

/* Priorité finale pour la couleur des réservations du calendrier. */
.dwm_main .booking_list > div.I,
.dwm_main .booking_list > div.I a {
  background: #F0FDF4 !important;
  color: #166534 !important;
}

/* Les réservations reprennent le vert très clair du bouton principal. */
.dwm_main .booking_list > div.I,
.dwm_main .booking_list > div.I a {
  background: #F0FDF4 !important;
  color: #166534 !important;
}

#policy_details.has-rule-issue a.quota-contact {
  color: #92400E !important;
  font-weight: 800;
  text-decoration: underline;
  text-underline-offset: 2px;
  white-space: nowrap;
}

@media (max-width: 58rem) {
  .banner nav.user-nav input[value="Se déconnecter"],
  .banner nav.user-nav input[value="Log off"] {
    display: none !important;
  }

  .settings-mobile-actions {
    display: flex !important;
    justify-content: center;
    margin-top: 0.75rem;
  }

  .settings-mobile-actions form,
  .settings-mobile-actions input[value="Se déconnecter"],
.settings-mobile-actions input[value="Log off"] {
    display: inline-flex !important;
  }
}

/* Priorité finale : fond bleu clair du bouton Quota, icônes conservées. */
.banner nav.user-nav > span.quota-status,
.banner nav.user-nav > span.quota-status:hover,
.banner nav.user-nav > span.quota-status:focus {
  background-color: #D7ECFA !important;
  color: #17324D !important;
}

.banner nav.user-nav > span.quota-status .quota-label,
.banner nav.user-nav > span.quota-status .quota-value {
  background-color: transparent !important;
}

/* Paramètres ouvre les autres pages de gestion dans un sous-menu. */
.banner nav.user-nav details.settings-menu {
  position: relative;
  display: inline-block;
}

.banner nav.user-nav details.settings-menu > summary.account-settings-action {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  max-height: 1.75rem !important;
  box-sizing: border-box !important;
  padding: 4px 25px !important;
  border-radius: 20px !important;
  list-style: none;
  cursor: pointer;
}

.banner nav.user-nav details.settings-menu > summary.account-settings-action {
  padding: 3px 20px 3px 2em !important;
  color: #1F2937 !important;
  background: #F3F4F6 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%231F2937' stroke-width='2' stroke-linecap='round' d='M12 3v2m0 14v2M3 12h2m14 0h2M5.6 5.6 7 7m10 10 1.4 1.4M18.4 5.6 17 7M7 17l-1.4 1.4'/%3E%3Ccircle cx='12' cy='12' r='4' fill='none' stroke='%231F2937' stroke-width='2'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: 0.65em center !important;
  background-size: 1em 1em !important;
  box-shadow: 0 7px 16px rgba(107, 114, 128, 0.36) !important;
  font-size: 0.8rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

.banner nav.user-nav details.settings-menu > summary.account-settings-action:hover,
.banner nav.user-nav details.settings-menu > summary.account-settings-action:focus {
  color: #1F2937 !important;
  background-color: #E5E7EB !important;
  box-shadow: 0 9px 20px rgba(107, 114, 128, 0.45) !important;
}

.banner nav.user-nav details.settings-menu > summary.account-settings-action::-webkit-details-marker {
  display: none;
}

.banner nav.user-nav details.settings-menu .settings-submenu {
  position: absolute;
  top: calc(100% + 0.4rem);
  right: 0;
  z-index: 1000;
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
  min-width: 15rem;
  padding: 0.65rem;
  border: 1px solid #D7E5F1;
  border-radius: 0.75rem;
  background: #FFFFFF;
  box-shadow: 0 10px 24px rgba(23, 50, 77, 0.22);
}

.banner nav.user-nav details.settings-menu .settings-submenu-link {
  display: flex !important;
  align-items: center;
  min-height: 1.75rem;
  box-sizing: border-box;
  padding: 4px 16px;
  border-radius: 20px;
  background: #F3F4F6 !important;
  color: #1F2937 !important;
  font-size: 0.8rem !important;
  font-weight: 700 !important;
  text-decoration: none;
  box-shadow: 0 4px 10px rgba(107, 114, 128, 0.22);
}

.banner nav.user-nav details.settings-menu .settings-submenu-link {
  background-repeat: no-repeat !important;
  background-position: 0.7em center !important;
  background-size: 1em 1em !important;
  padding-left: 2.2em !important;
}

.banner nav.user-nav details.settings-menu .settings-submenu-home {
  display: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%231F2937' stroke-width='2' d='m3 11 9-8 9 8v9a1 1 0 0 1-1 1h-5v-6H9v6H4a1 1 0 0 1-1-1z'/%3E%3C/svg%3E") !important;
}

.banner nav.user-nav details.settings-menu .settings-submenu-rooms {
  display: none !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%231F2937' stroke-width='2' d='M4 20V5h16v15M4 9h16M8 5v4m8-4v4M8 13h3m2 0h3M8 17h3m2 0h3'/%3E%3C/svg%3E") !important;
}

.banner nav.user-nav details.settings-menu .settings-submenu-users {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='9' cy='8' r='3' fill='none' stroke='%231F2937' stroke-width='2'/%3E%3Cpath fill='none' stroke='%231F2937' stroke-width='2' d='M3 20c.5-3.3 2.5-5 6-5s5.5 1.7 6 5m2-8a2.5 2.5 0 1 0 0-5m0 8c2.5 0 4 1.2 4.5 3'/%3E%3C/svg%3E") !important;
}

.banner nav.user-nav details.settings-menu .settings-submenu-quotas {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%231F2937' stroke-width='2' stroke-linecap='round' d='M4 19V5m0 14h16M8 16v-5m4 5V7m4 9v-8m4 8V4'/%3E%3C/svg%3E") !important;
}

.banner nav.user-nav details.settings-menu .settings-submenu-report {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%231F2937' stroke-width='2' d='M6 3h9l3 3v15H6zM14 3v4h4M9 12h6M9 16h6'/%3E%3C/svg%3E") !important;
}

.banner nav.user-nav details.user-account-menu {
  position: relative !important;
  display: inline-block !important;
  margin: 0 !important;
}

.banner nav.user-nav details.user-account-menu > summary.connected-user {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  max-height: 1.75rem !important;
  box-sizing: border-box !important;
  padding: 0.3rem 1rem !important;
  border: 0 !important;
  border-radius: 0.8em !important;
  background: #EDE9FE !important;
  color: #37306B !important;
  font-size: 0.8rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  list-style: none !important;
  cursor: pointer !important;
  white-space: nowrap !important;
  box-shadow: 0 7px 16px rgba(107, 114, 128, 0.36) !important;
}

.banner nav.user-nav details.user-account-menu > summary.connected-user::-webkit-details-marker {
  display: none !important;
}

.banner nav.user-nav details.user-account-menu > summary.connected-user::after {
  content: '▾';
  display: inline-block;
  margin-left: 0.45rem;
  color: #37306B;
  font-size: 1rem;
  font-weight: 800;
  line-height: 0.8;
  transition: transform 0.18s ease;
}

.banner nav.user-nav details.user-account-menu > summary.connected-user::before {
  content: '';
  display: inline-block;
  width: 1em;
  height: 1em;
  margin-right: 0.45rem;
  flex: 0 0 1em;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='8' r='3' fill='none' stroke='%2337306B' stroke-width='2'/%3E%3Cpath fill='none' stroke='%2337306B' stroke-width='2' d='M5 20c.7-3.4 3.1-5 7-5s6.3 1.6 7 5'/%3E%3C/svg%3E") center / contain no-repeat;
}

.banner nav.user-nav details.user-account-menu[open] > summary.connected-user::after {
  transform: rotate(180deg);
}

.banner nav.user-nav details.user-account-menu .user-account-submenu {
  position: absolute !important;
  top: calc(100% + 0.4rem) !important;
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%) !important;
  z-index: 1000 !important;
  display: flex !important;
  flex-direction: column !important;
  gap: 0.4rem !important;
  min-width: 15rem !important;
  max-width: calc(100vw - 1rem) !important;
  box-sizing: border-box !important;
  padding: 0.65rem !important;
  border: 1px solid #D7E5F1 !important;
  border-radius: 0.75rem !important;
  background: #FFFFFF !important;
  box-shadow: 0 10px 24px rgba(23, 50, 77, 0.22) !important;
}

.banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-link {
  display: flex !important;
  align-items: center !important;
  min-height: 1.75rem !important;
  box-sizing: border-box !important;
  padding: 4px 16px !important;
  border-radius: 20px !important;
  background: #F3F4F6 !important;
  color: #1F2937 !important;
  font-size: 0.8rem !important;
  font-weight: 700 !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}

.banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-link {
  background-repeat: no-repeat !important;
  background-position: 0.7em center !important;
  background-size: 1em 1em !important;
  padding-left: 2.2em !important;
}

.banner nav.user-nav details.user-account-menu .settings-submenu-my-reservations {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%231F2937' stroke-width='2' d='M6 3h9l3 3v15H6zM14 3v4h4M9 12h6M9 16h6'/%3E%3C/svg%3E") !important;
}

.banner nav.user-nav details.user-account-menu .settings-submenu-quotas {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%231F2937' stroke-width='2' stroke-linecap='round' d='M4 19V5m0 14h16M8 16v-5m4 5V7m4 9v-8m4 8V4'/%3E%3C/svg%3E") !important;
}

.banner nav.user-nav details.user-account-menu .settings-submenu-users {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='9' cy='8' r='3' fill='none' stroke='%231F2937' stroke-width='2'/%3E%3Cpath fill='none' stroke='%231F2937' stroke-width='2' d='M3 20c.5-3.3 2.5-5 6-5s5.5 1.7 6 5m2-8a2.5 2.5 0 1 0 0-5m0 8c2.5 0 4 1.2 4.5 3'/%3E%3C/svg%3E") !important;
}

.banner nav.user-nav details.user-account-menu .settings-submenu-calendar {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='5' width='18' height='16' rx='3' fill='none' stroke='%23249373' stroke-width='2'/%3E%3Cpath d='M8 3v4m8-4v4M3 10h18M8 14h3m2 0h3m-8 3h3' fill='none' stroke='%23249373' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") !important;
}

.banner nav.user-nav details.user-account-menu .settings-submenu-report {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%231F2937' stroke-width='2' d='M6 3h9l3 3v15H6zM14 3v4h4M9 12h6M9 16h6'/%3E%3C/svg%3E") !important;
}

.banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-link {
  background-image: none !important;
  padding-left: 0.8rem !important;
}

.banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-link::before {
  content: '';
  display: inline-block;
  width: 1em;
  height: 1em;
  margin-right: 0.55rem;
  flex: 0 0 1em;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

.banner nav.user-nav details.user-account-menu .settings-submenu-my-reservations::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%231F2937' stroke-width='2' d='M6 3h9l3 3v15H6zM14 3v4h4M9 12h6M9 16h6'/%3E%3C/svg%3E");
}

.banner nav.user-nav details.user-account-menu .settings-submenu-quotas::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%231F2937' stroke-width='2' stroke-linecap='round' d='M4 19V5m0 14h16M8 16v-5m4 5V7m4 9v-8m4 8V4'/%3E%3C/svg%3E");
}

.banner nav.user-nav details.user-account-menu .settings-submenu-users::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='9' cy='8' r='3' fill='none' stroke='%231F2937' stroke-width='2'/%3E%3Cpath fill='none' stroke='%231F2937' stroke-width='2' d='M3 20c.5-3.3 2.5-5 6-5s5.5 1.7 6 5m2-8a2.5 2.5 0 1 0 0-5m0 8c2.5 0 4 1.2 4.5 3'/%3E%3C/svg%3E");
}

.banner nav.user-nav details.user-account-menu .settings-submenu-calendar::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='5' width='18' height='16' rx='3' fill='none' stroke='%23249373' stroke-width='2'/%3E%3Cpath d='M8 3v4m8-4v4M3 10h18M8 14h3m2 0h3m-8 3h3' fill='none' stroke='%23249373' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
}

.banner nav.user-nav details.user-account-menu .settings-submenu-report::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%231F2937' stroke-width='2' d='M6 3h9l3 3v15H6zM14 3v4h4M9 12h6M9 16h6'/%3E%3C/svg%3E");
}

.banner nav.user-nav details.user-account-menu .settings-submenu-maintenance::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='3' fill='none' stroke='%231F2937' stroke-width='2'/%3E%3Cpath d='M12 2v3m0 14v3M2 12h3m14 0h3M4.9 4.9 7 7m10 10 2.1 2.1M19.1 4.9 17 7M7 17l-2.1 2.1' fill='none' stroke='%231F2937' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
}

.banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-link:hover,
.banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-link:focus {
  background: #E5E7EB !important;
}

.banner nav.user-nav details.user-account-menu .settings-submenu-section {
  display: flex !important;
  align-items: center !important;
  min-height: 1.2rem !important;
  margin: 0.2rem 0 0.05rem !important;
  padding: 0.15rem 0.55rem !important;
  color: #64748B !important;
  font-size: 0.68rem !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.04em !important;
}

.banner nav.user-nav details.user-account-menu .settings-submenu-admin-section .settings-submenu-section-title::before {
  content: '';
  display: inline-block;
  width: 1em;
  height: 1em;
  margin-right: 0.4rem;
  vertical-align: -0.15em;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='8' r='3' fill='none' stroke='%2364748B' stroke-width='2'/%3E%3Cpath fill='none' stroke='%2364748B' stroke-width='2' d='M5 20c.7-3.4 3.1-5 7-5s6.3 1.6 7 5'/%3E%3C/svg%3E") center / contain no-repeat;
}

.banner nav.user-nav details.user-account-menu .settings-submenu-admin-section .settings-submenu-section-title::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%2364748B' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M12 3 4 6v5c0 5 3.4 8.2 8 10 4.6-1.8 8-5 8-10V6zM9 12l2 2 4-4'/%3E%3C/svg%3E");
}

.quota-feature-settings {
  width: min(100%, 52rem);
  margin: 0 auto 1rem;
}

.quota-feature-note {
  flex: 1 1 auto;
  color: #64748B;
  font-size: 0.7rem;
}

.quota-message-settings {
  width: min(100%, 52rem);
  margin: 0 auto 1rem;
  padding: 1rem;
  box-sizing: border-box;
  border: 1px solid #CBD5E1;
  border-radius: 0.75rem;
  background: #F8FAFC;
}

.quota-message-settings h3 {
  margin: 0 0 0.75rem;
}

.banner nav.user-nav details.user-account-menu .user-account-logout,
.banner nav.user-nav details.user-account-menu .user-account-logout form {
  display: flex !important;
  justify-content: center !important;
  width: 100% !important;
  margin: 0 !important;
}

.banner nav.user-nav details.user-account-menu .user-account-logout input.account-action {
  width: 100% !important;
  box-sizing: border-box !important;
  padding-left: 2.1em !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%231F2937' stroke-width='2' d='M10 5H5v14h5M14 8l4 4-4 4M9 12h9'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: 0.7em center !important;
  background-size: 1em 1em !important;
}

@media (min-width: 58.01rem) {
  .banner nav.user-nav details.user-account-menu .user-account-logout {
    display: none !important;
  }
}

.banner nav.user-nav details.user-account-menu > summary.connected-user:hover,
.banner nav.user-nav details.user-account-menu > summary.connected-user:focus {
  background: #DDD6FE !important;
  color: #37306B !important;
  box-shadow: 0 9px 20px rgba(107, 114, 128, 0.45) !important;
}

/* Accueil est accessible depuis le nom connecté, pas comme bouton séparé. */
.banner nav.user-nav a.menu-home {
  display: inline-flex !important;
}

.banner nav.user-nav a.menu-home.admin-home {
  display: none !important;
}

.banner nav.user-nav a.menu-home,
.banner nav.user-nav a.menu-home.admin-home {
  display: inline-flex !important;
}

@media (max-width: 58rem) {
  .banner nav.user-nav details.user-account-menu > summary.connected-user {
    height: 1.75rem !important;
    min-height: 1.75rem !important;
    max-height: 1.75rem !important;
    padding: 0.3rem 0.75rem !important;
  }

  .banner nav.user-nav details.user-account-menu .user-account-logout input.account-action {
    display: inline-flex !important;
    height: 1.75rem !important;
    min-height: 1.75rem !important;
    max-height: 1.75rem !important;
  }

  .banner nav.user-nav.quota-feature-disabled > form input[value="Se déconnecter"],
  .banner nav.user-nav.quota-feature-disabled > form input[value="Log off"] {
    display: inline-flex !important;
  }

  .banner nav.user-nav.quota-feature-disabled details.user-account-menu .user-account-logout {
    display: none !important;
  }

}

/* Même taille de police pour tous les boutons du compte. */
.banner nav.user-nav a.menu-home,
.banner nav.user-nav a.connected-user,
.banner nav.user-nav > span.quota-status,
.banner nav.user-nav input.account-action,
.banner nav.user-nav input[value="Se déconnecter"],
.banner nav.user-nav input[value="Log off"],
.banner nav.user-nav input[value="S'identifier"],
.banner nav.user-nav input[value="Log in"] {
  font-size: 0.8rem !important;
}

/* Ajouter une réservation : fond jaune clair sans contour vert. */
.banner .company > a.button[href="edit_entry.php"] {
  border: 0 !important;
  background-color: #FEF3C7 !important;
}

.banner .company > a.button[href="edit_entry.php"]:hover,
.banner .company > a.button[href="edit_entry.php"]:focus {
  border: 0 !important;
  background-color: #FDE68A !important;
}

/* Ajouter une réservation : fond vert clair et icône verte. */
.banner .company > a.button[href="edit_entry.php"],
.banner .company > a.button[href="edit_entry.php"]:hover,
.banner .company > a.button[href="edit_entry.php"]:focus {
  height: 2.35rem !important;
  min-height: 2.35rem !important;
  max-height: 2.35rem !important;
  padding-left: 30px !important;
  padding-right: 30px !important;
  font-size: 15px !important;
  background-color: #F0FDF4 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%23166634' stroke-width='2.5' d='M12 5v14M5 12h14'/%3E%3C/svg%3E") !important;
  color: #166534 !important;
  box-shadow: none !important;
}

.banner .company > a.button[href="edit_entry.php"]:hover,
.banner .company > a.button[href="edit_entry.php"]:focus {
  background-color: #DCFCE7 !important;
  box-shadow: none !important;
}

/* Sur mobile uniquement, Quota précède Accueil. */
@media (max-width: 58rem) {
  .banner nav.user-nav > span.quota-status {
    order: 2 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    align-self: center !important;
  }

  .banner nav.user-nav a.menu-home.admin-home {
    display: inline-flex !important;
  }

  .banner nav.user-nav details.settings-menu {
    order: 1 !important;
  }

  .banner nav.user-nav a.connected-user {
    order: 3 !important;
  }

  .banner nav.user-nav {
    align-items: center !important;
    flex-wrap: nowrap !important;
    justify-content: flex-end !important;
    width: 100% !important;
    overflow-x: auto;
    overflow-y: visible;
    gap: 0.5rem !important;
  }

  .banner nav.user-nav > a,
  .banner nav.user-nav > details,
  .banner nav.user-nav > span,
  .banner nav.user-nav > form {
    align-self: center !important;
    position: static !important;
    top: auto !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    vertical-align: middle !important;
  }

  .banner nav.user-nav a.connected-user {
    margin-left: 0.45rem !important;
    margin-right: 0.45rem !important;
  }
}

.banner nav.user-nav details.settings-menu .settings-submenu-link:hover,
.banner nav.user-nav details.settings-menu .settings-submenu-link:focus {
  background: #E5E7EB !important;
  color: #1F2937 !important;
  box-shadow: 0 6px 14px rgba(107, 114, 128, 0.28);
}

/* Sur mobile, le sous-menu Paramètres reste attaché au bouton et visible. */
@media (max-width: 58rem) {
  .banner nav.user-nav {
    overflow-x: visible !important;
    overflow-y: visible !important;
  }

  .banner nav.user-nav details.settings-menu {
    position: relative !important;
    overflow: visible !important;
  }

  .banner nav.user-nav details.settings-menu .settings-submenu {
    position: absolute !important;
    top: calc(100% + 0.4rem) !important;
    left: 0 !important;
    right: auto !important;
    width: min(15rem, calc(100vw - 1rem)) !important;
    min-width: 0 !important;
    transform: none !important;
    z-index: 10000 !important;
  }

  .banner nav.user-nav details.settings-menu .settings-submenu-home {
    display: flex !important;
  }

  .banner nav.user-nav details.settings-menu .settings-mobile-actions,
  .banner nav.user-nav details.settings-menu .settings-mobile-actions form,
  .banner nav.user-nav details.settings-menu .settings-mobile-actions input[value="Se déconnecter"],
  .banner nav.user-nav details.settings-menu .settings-mobile-actions input[value="Log off"] {
    display: flex !important;
  }
}

/* Sur PC, l'action est désormais dans le menu : masquer uniquement l'ancien doublon. */
@media (min-width: 58.01rem) {
  .banner:not(.simple) .company > a.button[href="edit_entry.php"] {
    display: none !important;
  }
}

/* Sur PC, Ajouter une réservation reprend exactement les dimensions du menu. */
@media (min-width: 58.01rem) {
  .banner nav.user-nav a.menu-home,
  .banner nav.user-nav a.quick-add-booking,
  .banner nav.user-nav span.quota-status,
  .banner nav.user-nav a.connected-user {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    height: 1.75rem !important;
    min-height: 1.75rem !important;
    max-height: 1.75rem !important;
    padding: 0.3rem 1rem !important;
    line-height: 1 !important;
    white-space: nowrap !important;
    border-radius: 0.8em !important;
    background-image: none !important;
    box-shadow: none !important;
    filter: none !important;
  }

  .banner nav.user-nav a.account-settings-action {
    border-radius: 0.8em !important;
  }
}

/* Ombre finale identique au bouton Paramètres. */
.banner nav.user-nav a.menu-home,
.banner nav.user-nav a.quick-add-booking,
.banner nav.user-nav span.quota-status,
.banner nav.user-nav a.connected-user,
.banner .company > a.button[href="edit_entry.php"] {
  box-shadow: 0 7px 16px rgba(107, 114, 128, 0.36) !important;
}

.banner nav.user-nav a.menu-home:hover,
.banner nav.user-nav a.menu-home:focus,
.banner nav.user-nav a.quick-add-booking:hover,
.banner nav.user-nav a.quick-add-booking:focus,
.banner nav.user-nav span.quota-status:hover,
.banner nav.user-nav span.quota-status:focus,
.banner nav.user-nav a.connected-user:hover,
.banner nav.user-nav a.connected-user:focus,
.banner .company > a.button[href="edit_entry.php"]:hover,
.banner .company > a.button[href="edit_entry.php"]:focus {
  box-shadow: 0 9px 20px rgba(107, 114, 128, 0.45) !important;
}

/* Ajouter une réservation utilise le même fond clair que les autres boutons. */
.banner nav.user-nav a.quick-add-booking,
.banner .company > a.button[href="edit_entry.php"] {
  background: #F0FBF8 !important;
  color: #0F766E !important;
}

.banner nav.user-nav a.quick-add-booking:hover,
.banner nav.user-nav a.quick-add-booking:focus,
.banner .company > a.button[href="edit_entry.php"]:hover,
.banner .company > a.button[href="edit_entry.php"]:focus {
  background: #E7F8F6 !important;
  color: #0F766E !important;
}

/* Sur mobile, Ajouter une réservation conserve son identité verte. */
@media (max-width: 58rem) {
  .banner .company > a.button[href="edit_entry.php"] {
    background: #F0FBF8 !important;
    color: #0F766E !important;
  }

  .banner .company > a.button[href="edit_entry.php"]:hover,
  .banner .company > a.button[href="edit_entry.php"]:focus {
    background: #E7F8F6 !important;
    color: #0F766E !important;
  }
}

/* Le bouton S'identifier reste blanc, comme demandé. */
.banner nav.user-nav input[value="S'identifier"],
.banner nav.user-nav input[value="Log in"] {
  background: #FFFFFF !important;
  color: #1F2937 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='8' r='3' fill='none' stroke='%231F2937' stroke-width='2'/%3E%3Cpath fill='none' stroke='%231F2937' stroke-width='2' d='M5 20c.7-3.4 3.1-5 7-5s6.3 1.6 7 5'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: 0.7em center !important;
  background-size: 1.05em 1.05em !important;
  padding-left: 2.15em !important;
  box-shadow: 0 7px 16px rgba(107, 114, 128, 0.36) !important;
}

.banner nav.user-nav input[value="S'identifier"]:hover,
.banner nav.user-nav input[value="S'identifier"]:focus,
.banner nav.user-nav input[value="Log in"]:hover,
.banner nav.user-nav input[value="Log in"]:focus {
  background: #F3F4F6 !important;
  color: #1F2937 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='8' r='3' fill='none' stroke='%231F2937' stroke-width='2'/%3E%3Cpath fill='none' stroke='%231F2937' stroke-width='2' d='M5 20c.7-3.4 3.1-5 7-5s6.3 1.6 7 5'/%3E%3C/svg%3E") !important;
  box-shadow: 0 9px 20px rgba(107, 114, 128, 0.45) !important;
}

/* Bouton supérieur : une seule icône utilisateur, sans empilement. */
.banner nav.user-nav > form > input.account-action[value="S'identifier"],
.banner nav.user-nav > form > input.account-action[value="Log in"] {
  background-color: #FFFFFF !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='8' r='3' fill='none' stroke='%231F2937' stroke-width='2'/%3E%3Cpath fill='none' stroke='%231F2937' stroke-width='2' d='M5 20c.7-3.4 3.1-5 7-5s6.3 1.6 7 5'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: 0.7em 50% !important;
  background-size: 1.05em 1.05em !important;
  padding-left: 2.15em !important;
}

/* Les conflits de calendrier reprennent le même aspect que l'alerte quota. */
#schedule_details.has-conflict,
#policy_details.has-rule-issue {
  border-left: 5px solid #D97706 !important;
  border-radius: 0.75rem !important;
  background: #FFFBEB !important;
  color: #451A03 !important;
  box-shadow: 0 4px 10px rgba(146, 64, 14, 0.16) !important;
  padding: 1rem 1.25rem !important;
}

#schedule_details.has-conflict p,
#schedule_details.has-conflict li,
#policy_details.has-rule-issue p,
#policy_details.has-rule-issue li {
  color: #451A03 !important;
}

#schedule_details.has-conflict li,
#policy_details.has-rule-issue li {
  margin: 0.5rem 0;
  padding: 0.75rem 1rem;
  border-radius: 0.5rem;
  background: #FEF3C7 !important;
  font-weight: 700;
}

/* Sur PC, Paramètres reprend exactement le gabarit des autres boutons du menu. */
@media (min-width: 58.01rem) {
  .banner nav.user-nav details.settings-menu > summary.account-settings-action {
    display: none !important;
  }

  .banner nav.user-nav details.settings-menu {
    display: inline-flex !important;
    align-items: center !important;
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
  }

  .banner nav.user-nav details.settings-menu > summary.account-settings-action {
    display: none !important;
  }

  .banner nav.user-nav details.settings-menu > .settings-submenu {
    position: static !important;
    display: inline-flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 0.5rem !important;
    min-width: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .banner nav.user-nav details.settings-menu {
    background: transparent !important;
    border: 0 !important;
    box-shadow: none !important;
    filter: none !important;
  }

  .banner nav.user-nav details.settings-menu > summary.account-settings-action {
    display: none !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
    width: auto !important;
    height: 1.75rem !important;
    min-height: 1.75rem !important;
    max-height: 1.75rem !important;
    margin: 0 !important;
    padding: 0.3rem 0.65rem !important;
    border-radius: 0.8em !important;
    background: #F3F4F6 !important;
    color: #1F2937 !important;
    font-size: 0.8rem !important;
    font-weight: 700 !important;
    line-height: 1 !important;
    box-shadow: 0 7px 16px rgba(107, 114, 128, 0.36) !important;
    border: 0 !important;
    outline: 0 !important;
  }

  .banner nav.user-nav details.settings-menu > summary.account-settings-action:hover,
  .banner nav.user-nav details.settings-menu > summary.account-settings-action:focus {
    background: #9CA3AF !important;
    color: #1F2937 !important;
    box-shadow: 0 9px 20px rgba(107, 114, 128, 0.45) !important;
  }

  .banner nav.user-nav details.settings-menu > summary.account-settings-action::before {
    content: '';
    display: inline-block;
    width: 0.85em;
    height: 0.85em;
    margin-right: 0.45em;
    flex: 0 0 0.85em;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%231F2937' stroke-width='2' stroke-linecap='round' d='M12 3v2m0 14v2M3 12h2m14 0h2M5.6 5.6 7 7m10 10 1.4 1.4M18.4 5.6 17 7M7 17l-1.4 1.4'/%3E%3Ccircle cx='12' cy='12' r='4' fill='none' stroke='%231F2937' stroke-width='2'/%3E%3C/svg%3E") center / contain no-repeat;
  }

  .banner nav.user-nav details.settings-menu > summary.account-settings-action {
    display: inline-flex !important;
    padding: 3px 20px 3px 2em !important;
    background: #F3F4F6 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%231F2937' stroke-width='2' stroke-linecap='round' d='M12 3v2m0 14v2M3 12h2m14 0h2M5.6 5.6 7 7m10 10 1.4 1.4M18.4 5.6 17 7M7 17l-1.4 1.4'/%3E%3Ccircle cx='12' cy='12' r='4' fill='none' stroke='%231F2937' stroke-width='2'/%3E%3C/svg%3E") no-repeat 0.65em center / 1em 1em !important;
    color: #1F2937 !important;
  }
}

/* Final quota layout hook. */
@media (min-width: 44.01rem) {
  .settings-page.quota-page .quota-main-card { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
}
@media (max-width: 44rem) {
  .settings-page.quota-page .quota-main-card { display: grid !important; grid-template-columns: 1fr !important; }
}

/* Final quota component styling. */
.quota-page .quota-main-card {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 1rem !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.quota-page .quota-page-header,
.quota-page .quota-config-card,
.quota-page .quota-search-title { grid-column: 1 / -1 !important; }
.quota-page .quota-config-card,
.quota-page .quota-selector,
.quota-page .quota-edit-card {
  margin: 0 !important;
  padding: 1.25rem !important;
  border: 1px solid #D9E3EC !important;
  border-radius: 0.9rem !important;
  background: #FFFFFF !important;
  box-shadow: 0 8px 24px rgba(22, 50, 79, 0.08) !important;
}
.quota-page .quota-settings-form {
  display: grid !important;
  grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr) auto !important;
  align-items: end !important;
  gap: 1rem !important;
}
.quota-page .quota-feature-settings,
.quota-page .quota-message-settings {
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.quota-page input[type="email"],
.quota-page input[type="search"],
.quota-page input[type="number"] {
  width: 100% !important;
  min-height: 2.65rem !important;
  box-sizing: border-box !important;
  padding: 0.65rem 0.8rem !important;
  border: 1px solid #C8D5E1 !important;
  border-radius: 0.6rem !important;
  background: #FFFFFF !important;
  color: #16324F !important;
  box-shadow: none !important;
}
.quota-page .quota-settings-form > button,
.quota-page .quota-edit-form > button {
  min-height: 2.65rem !important;
  padding: 0.65rem 1rem !important;
  border: 0 !important;
  border-radius: 0.6rem !important;
  background: #176B87 !important;
  color: #FFFFFF !important;
  font-weight: 700 !important;
}
.quota-page .quota-search-title {
  margin: 0 !important;
  color: #16324F !important;
  font-size: 0.95rem !important;
  font-weight: 750 !important;
}
.quota-page .quota-edit-form {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: end !important;
  gap: 0.75rem !important;
}
.quota-page .quota-edit-form label {
  grid-column: 1 / -1 !important;
  margin: 0 !important;
  color: #16324F !important;
  font-weight: 700 !important;
}
@media (max-width: 44rem) {
  .quota-page .quota-main-card { grid-template-columns: 1fr !important; gap: 0.75rem !important; }
  .quota-page .quota-settings-form,
  .quota-page .quota-edit-form { grid-template-columns: 1fr !important; gap: 0.85rem !important; }
  .quota-page .quota-config-card,
  .quota-page .quota-page-header,
  .quota-page .quota-search-title { grid-column: 1 !important; }
  .quota-page .quota-settings-form > button,
  .quota-page .quota-edit-form > button { width: 100% !important; }
}

.quota-page .quota-selector {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 0.6rem !important;
  justify-self: center !important;
  width: min(100%, 34rem) !important;
}
.quota-page .quota-selector label,
.quota-page .quota-selector select {
  width: 100% !important;
  max-width: 30rem !important;
}
.quota-page .quota-selector label {
  color: #16324F !important;
  font-weight: 700 !important;
  text-align: left !important;
}
.quota-page .quota-save-bottom {
  grid-column: 1 / -1 !important;
  justify-self: end !important;
  min-height: 2.65rem !important;
  margin-top: 0.25rem !important;
  padding: 0.65rem 1rem !important;
  border: 0 !important;
  border-radius: 0.6rem !important;
  background: #176B87 !important;
  color: #FFFFFF !important;
  font-weight: 700 !important;
  cursor: pointer !important;
}
.quota-page .quota-save-bottom:hover,
.quota-page .quota-save-bottom:focus {
  background: #12566D !important;
}
.quota-page .quota-main-card {
  display: block !important;
  width: min(100%, 58rem) !important;
  max-width: 58rem !important;
  margin: 0 auto !important;
  padding: 1.35rem !important;
  border: 1px solid #D9E2EC !important;
  border-radius: 14px !important;
  background: linear-gradient(135deg, #EAF4FC 0%, #F2EEFF 50%, #F0FDF4 100%) !important;
  box-shadow: 0 10px 26px rgba(23, 50, 77, 0.10) !important;
}
.quota-page .quota-page-header,
.quota-page .quota-config-card,
.quota-page .quota-search-title,
.quota-page .quota-selector,
.quota-page .quota-edit-card,
.quota-page .quota-save-bottom {
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}
.quota-page .quota-config-card,
.quota-page .quota-selector,
.quota-page .quota-edit-card {
  padding: 1rem 0 !important;
  border: 0 !important;
  border-top: 1px solid #E2E8F0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.quota-page .quota-page-header {
  padding-bottom: 1rem !important;
}
.quota-page .quota-search-title {
  margin: 1rem 0 0 !important;
  padding-top: 1rem !important;
  border-top: 1px solid #E2E8F0 !important;
}
.quota-page .quota-save-actions {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 0.65rem !important;
  margin-top: 1rem !important;
}
.quota-page .quota-save-bottom {
  width: fit-content !important;
  min-width: 0 !important;
  min-height: 2rem !important;
  margin-left: 0 !important;
  padding: 0.35rem 0.75rem 0.35rem 1.8em !important;
  border: 1px solid #2F80B7 !important;
  border-radius: 10px !important;
  background-color: #3C8CCC !important;
  color: #FFFFFF !important;
  font-size: 0.8rem !important;
  font-weight: 700 !important;
  box-shadow: 0 4px 10px rgba(23, 50, 77, 0.16) !important;
}
.quota-page .quota-save-bottom:hover,
.quota-page .quota-save-bottom:focus {
  background-color: #256FA3 !important;
  color: #FFFFFF !important;
  box-shadow: 0 7px 16px rgba(23, 50, 77, 0.24) !important;
}
.settings-page.quota-page {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}
.quota-page .quota-main-card {
  align-self: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Correction finale : centrage de la page Quotas sur écran ordinateur. */
@media (min-width: 40.01rem) {
  .settings-page.quota-page {
    width: min(100% - 2rem, 68rem) !important;
    max-width: 68rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
    text-align: left !important;
  }
  .settings-page.quota-page .quota-main-card {
    display: block !important;
    width: min(100%, 44rem) !important;
    max-width: 44rem !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }
  .settings-page.quota-page .quota-save-actions {
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    width: 100% !important;
    margin: 0.5rem 0 0 !important;
    padding-top: 0 !important;
    border-top: 0 !important;
    text-align: center !important;
  }
  .settings-page.quota-page .quota-save-bottom {
    margin-left: 0 !important;
    margin-right: auto !important;
  }
  .settings-page.quota-page .quota-edit-form {
    grid-template-columns: minmax(0, 1fr) !important;
    width: 12rem !important;
    max-width: 100% !important;
  }
  .settings-page.quota-page .quota-edit-form label,
  .settings-page.quota-page .quota-edit-form input[type="number"],
  .settings-page.quota-page .quota-edit-form small {
    grid-column: 1 !important;
    grid-row: auto !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  .settings-page.quota-page .quota-selector select {
    width: 16rem !important;
    max-width: 100% !important;
  }
  .settings-page.quota-page .quota-edit-form input[type="number"] {
    width: 12rem !important;
    max-width: 100% !important;
  }
  .settings-page.quota-page .quota-edit-form input[type="number"] {
    width: 12rem !important;
  }
  .settings-page.quota-page .quota-selector {
    align-items: flex-start !important;
  }
  .settings-page.quota-page .quota-selector select,
  .settings-page.quota-page .quota-edit-form,
  .settings-page.quota-page .quota-edit-form input[type="number"] {
    margin-left: 0 !important;
    margin-right: auto !important;
  }
  #quota_user {
    width: 16rem !important;
    max-width: 100% !important;
  }
  #monthly_booking_quota {
    width: 12rem !important;
    max-width: 100% !important;
  }
}

/* Même hiérarchie typographique pour tous les libellés des formulaires. */
.settings-page.quota-page .quota-edit-form label,
.settings-page.quota-page .quota-selector label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  font-size: 0.86rem !important;
  line-height: 1.35 !important;
  font-weight: 700 !important;
}

/* Icônes des deux titres de formulaires, dans le style du système de quotas. */
.settings-page.quota-page .quota-selector label::before,
.settings-page.quota-page .quota-edit-form label::before {
  content: '';
  display: inline-block;
  width: 1rem;
  height: 1rem;
  flex: 0 0 1rem;
  border-radius: 0.35rem;
  background-color: #E6F6F2;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 0.85rem;
}
.settings-page.quota-page .quota-selector label::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='8' r='3.5' fill='none' stroke='%230F766E' stroke-width='2'/%3E%3Cpath d='M5 20c.8-3.4 3.2-5.2 7-5.2s6.2 1.8 7 5.2' fill='none' stroke='%230F766E' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
}
.settings-page.quota-page .quota-edit-form label::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 19V5m0 14h16M8 16v-5m4 5V7m4 9v-8m4 8V4' fill='none' stroke='%230F766E' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
}

.settings-page.quota-page .quota-edit-card .quota-edit-form small {
  display: block !important;
  width: 12rem !important;
  max-width: 12rem !important;
  margin: 0 0 0.8rem !important;
  color: #94A3B8 !important;
  font-size: 0.72rem !important;
  line-height: 1.25 !important;
  font-weight: 400 !important;
}

.settings-page.quota-page .quota-config-card,
.settings-page.quota-page .quota-feature-settings {
  height: auto !important;
  min-height: 0 !important;
  box-sizing: border-box !important;
}
.settings-page.quota-page .quota-card-description {
  height: auto !important;
  min-height: 2.8em !important;
  margin-bottom: 0.8rem !important;
  line-height: 1.4 !important;
}
@media (min-width: 40.01rem) {
  .settings-page.quota-page .quota-config-card {
    width: 24rem !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: auto !important;
  }
}
@media (max-width: 40rem) {
  .settings-page.quota-page .quota-edit-card .quota-edit-form small {
    width: 100% !important;
    max-width: none !important;
  }
}

/* Les repères numérotés sont remplacés par les icônes thématiques. */
.settings-page.quota-page .quota-selector .quota-step-number {
  display: none !important;
}
.settings-page.quota-page .quota-selector label {
  margin-left: 0 !important;
}
@media (max-width: 40rem) {
  .settings-page.quota-page .quota-selector label {
    grid-column: 1 / -1 !important;
    grid-row: 1 !important;
  }
}

/* Hauteur identique pour la liste utilisateur et le champ de quota. */
.settings-page.quota-page .quota-selector select,
.settings-page.quota-page .quota-edit-form input[type="number"] {
  height: 2.1rem !important;
  min-height: 2.1rem !important;
  box-sizing: border-box !important;
  padding-top: 0.35rem !important;
  padding-bottom: 0.35rem !important;
}

/* Mobile : le repère de l'étape reste séparé du libellé et le sélecteur
 * ne force pas une largeur de bureau. */
@media (max-width: 40rem) {
  .settings-page.quota-page .quota-page-header h1 {
    margin: 0 0 0.35rem !important;
    font-size: 1.55rem !important;
    line-height: 1.25 !important;
  }
  .settings-page.quota-page .quota-page-header {
    padding: 0 0.25rem 1rem !important;
  }
  .settings-page.quota-page .quota-save-actions {
    width: 100% !important;
    box-sizing: border-box !important;
    margin: 0 0 1rem !important;
    padding: 1rem 0 0 !important;
    border-top: 1px solid #E2E8F0 !important;
    text-align: left !important;
  }
  .settings-page.quota-page .quota-save-bottom {
    margin-left: 0 !important;
    justify-self: start !important;
  }
  .settings-page.quota-page .quota-selector {
    display: grid !important;
    grid-template-columns: 1.75rem minmax(0, 1fr) !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
    padding: 1rem !important;
    column-gap: 0.7rem !important;
    row-gap: 0.45rem !important;
  }
  .settings-page.quota-page .quota-selector .quota-step-number {
    position: static !important;
    grid-column: 1 !important;
    grid-row: 1 !important;
    font-size: 0 !important;
    background-color: #DDF4F1 !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='8' r='3.5' fill='none' stroke='%2318746E' stroke-width='1.8'/%3E%3Cpath d='M5 20c.8-3.4 3.2-5.2 7-5.2s6.2 1.8 7 5.2' fill='none' stroke='%2318746E' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") !important;
    background-position: center !important;
    background-repeat: no-repeat !important;
    background-size: 1.05rem !important;
  }
  .settings-page.quota-page .quota-selector label {
    grid-column: 2 !important;
    grid-row: 1 !important;
    width: 100% !important;
    max-width: none !important;
    margin-left: 0 !important;
    margin-bottom: 0 !important;
    align-self: center !important;
  }
  .settings-page.quota-page .quota-selector select {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: none !important;
  }
  .settings-page.quota-page .quota-edit-form {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 0.45rem !important;
    width: 100% !important;
    max-width: none !important;
  }
  .settings-page.quota-page .quota-edit-form label,
  .settings-page.quota-page .quota-edit-form input[type="number"],
  .settings-page.quota-page .quota-edit-form small {
    grid-column: 1 !important;
    grid-row: auto !important;
    width: 100% !important;
    box-sizing: border-box !important;
  }
  #quota_user,
  #monthly_booking_quota {
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
  }
}
/* Couleur finale des réservations du calendrier. */
.dwm_main .booking_list > div.I,
.dwm_main .booking_list > div.I a {
  background: #F0FDF4 !important;
  color: #166534 !important;
}

/* Dernière priorité mobile : blocs empilés et largeur cohérente. */
@media (max-width: 40rem) {
  .settings-page.quota-page .quota-main-card,
  .settings-page.quota-page .quota-config-card,
  .settings-page.quota-page .quota-edit-card,
  .settings-page.quota-page .quota-save-actions {
    display: block !important;
    float: none !important;
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
  }
  .settings-page.quota-page .quota-selector,
  .settings-page.quota-page .quota-stats,
  .settings-page.quota-page .quota-edit-form {
    display: grid !important;
    float: none !important;
    width: 100% !important;
    max-width: none !important;
    box-sizing: border-box !important;
  }
  .settings-page.quota-page .quota-stats,
  .settings-page.quota-page .quota-edit-form {
    grid-template-columns: 1fr !important;
  }
}

/* Présentation harmonisée finale de la page Quotas. */
.settings-page.quota-page .quota-main-card {
  display: block !important;
  width: min(100%, 36rem) !important;
  max-width: 36rem !important;
  margin: 0 auto !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}
.settings-page.quota-page .quota-page-header {
  margin: 0 0 1rem !important;
  padding: 0 0.25rem 0.75rem !important;
  border-bottom: 1px solid #DCE7F2 !important;
}
.settings-page.quota-page .quota-page-header h1 {
  margin: 0 0 0.35rem !important;
  color: #17324D !important;
  font-size: 1.35rem !important;
  line-height: 1.25 !important;
}
.settings-page.quota-page .quota-page-intro {
  margin: 0 !important;
  color: #64748B !important;
  font-size: 0.84rem !important;
  line-height: 1.4 !important;
}
.settings-page.quota-page .quota-config-card,
.settings-page.quota-page .quota-selector,
.settings-page.quota-page .quota-edit-card {
  width: 100% !important;
  max-width: none !important;
  box-sizing: border-box !important;
  margin: 0 0 0.85rem !important;
  padding: 1rem 1.15rem !important;
  border: 1px solid #D9E5EF !important;
  border-radius: 0.75rem !important;
  background: #FFFFFF !important;
  box-shadow: 0 5px 14px rgba(23, 50, 77, 0.06) !important;
}
.settings-page.quota-page .quota-config-card {
  border-left: 3px solid #44BCB4 !important;
}
.settings-page.quota-page .quota-search-title {
  margin: 1rem 0 0.45rem !important;
  color: #17324D !important;
  font-size: 0.92rem !important;
}
.settings-page.quota-page .quota-selector {
  display: flex !important;
  align-items: flex-start !important;
  gap: 0.45rem !important;
  background: #F8FBFD !important;
}
.settings-page.quota-page .quota-selector label {
  margin: 0 !important;
  color: #17324D !important;
}
.settings-page.quota-page .quota-selector select {
  width: 16rem !important;
  max-width: 100% !important;
  margin: 0 !important;
}
.settings-page.quota-page .quota-selector {
  margin-bottom: 1.25rem !important;
}
.settings-page.quota-page .quota-main-card .quota-selector {
  margin-bottom: 3rem !important;
  position: relative !important;
  z-index: 1 !important;
}
.settings-page.quota-page .quota-main-card .quota-edit-card {
  margin-top: 3rem !important;
}
.settings-page.quota-page .quota-block-gap {
  display: block !important;
  width: 100% !important;
  height: 2rem !important;
  clear: both !important;
}
@media (max-width: 40rem) {
  .settings-page.quota-page .quota-block-gap {
    height: 1.5rem !important;
  }
}
.settings-page.quota-page .quota-edit-card h3 {
  margin: 0 !important;
  color: #17324D !important;
  font-size: 1rem !important;
}
.settings-page.quota-page .quota-user-heading {
  margin-bottom: 0.8rem !important;
}
.settings-page.quota-page .quota-stats {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0.6rem !important;
  margin-bottom: 0.85rem !important;
}
.settings-page.quota-page .quota-stat {
  padding: 0.65rem 0.8rem !important;
  border-radius: 0.55rem !important;
}
.settings-page.quota-page .quota-edit-form {
  display: grid !important;
  grid-template-columns: 12rem !important;
  width: 12rem !important;
  max-width: 100% !important;
  gap: 0.35rem !important;
  margin: 0 !important;
  padding-top: 0.8rem !important;
  border-top: 1px solid #E5EDF3 !important;
}
.settings-page.quota-page .quota-edit-form label,
.settings-page.quota-page .quota-edit-form input[type="number"] {
  width: 12rem !important;
  max-width: 100% !important;
  box-sizing: border-box !important;
}
.settings-page.quota-page .quota-edit-form small {
  width: 12rem !important;
  max-width: 12rem !important;
  margin: 0.1rem 0 0 !important;
  font-size: 0.76rem !important;
  line-height: 1.35 !important;
}
.settings-page.quota-page .quota-save-actions {
  display: flex !important;
  justify-content: flex-start !important;
  margin: 0.15rem 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
}
.settings-page.quota-page .quota-save-bottom {
  margin: 0 !important;
  background: #238B83 !important;
  border-color: #238B83 !important;
}
.settings-page.quota-page .quota-back-button {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: static !important;
  flex: 0 0 auto !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 2rem !important;
  margin: 0 0.5rem 0 0 !important;
  padding: 0.35rem 0.9rem !important;
  border: 1px solid #CBD5E1 !important;
  border-radius: 0.55rem !important;
  background: #F8FAFC !important;
  color: #536579 !important;
  font-size: 0.8rem !important;
  cursor: pointer !important;
}
.settings-page.quota-page .quota-back-button:hover,
.settings-page.quota-page .quota-back-button:focus {
  background: #E2E8F0 !important;
  color: #17324D !important;
}
@media (max-width: 40rem) {
  .settings-page.quota-page .quota-main-card {
    width: 100% !important;
    max-width: none !important;
  }
  .settings-page.quota-page .quota-config-card,
  .settings-page.quota-page .quota-selector,
  .settings-page.quota-page .quota-edit-card {
    padding: 0.95rem !important;
  }
  .settings-page.quota-page .quota-selector {
    display: grid !important;
    grid-template-columns: 1rem minmax(0, 1fr) !important;
  }
  .settings-page.quota-page .quota-selector label {
    grid-column: 1 / -1 !important;
    grid-row: 1 !important;
  }
  .settings-page.quota-page .quota-selector select {
    grid-column: 1 / -1 !important;
    grid-row: 2 !important;
    width: 100% !important;
  }
  .settings-page.quota-page .quota-stats {
    grid-template-columns: 1fr !important;
  }
  .settings-page.quota-page .quota-edit-form,
  .settings-page.quota-page .quota-edit-form label,
  .settings-page.quota-page .quota-edit-form input[type="number"],
  .settings-page.quota-page .quota-edit-form small {
    width: 100% !important;
    max-width: none !important;
  }
}

/* Adaptation mobile complète de la page Quotas. */
@media (max-width: 40rem) {
  .settings-page.quota-page {
    width: calc(100% - 1rem) !important;
    max-width: none !important;
    margin: 1rem auto !important;
  }
  .settings-page.quota-page .quota-main-card {
    width: 100% !important;
    max-width: none !important;
  }
  .settings-page.quota-page .quota-page-header {
    margin-bottom: 0.9rem !important;
    padding: 0 0.15rem 0.7rem !important;
  }
  .settings-page.quota-page .quota-page-header h1 {
    font-size: 1.25rem !important;
  }
  .settings-page.quota-page .quota-config-card,
  .settings-page.quota-page .quota-selector,
  .settings-page.quota-page .quota-edit-card {
    width: 100% !important;
    max-width: none !important;
    margin-bottom: 0.75rem !important;
    padding: 0.9rem !important;
  }
  .settings-page.quota-page .quota-selector {
    display: block !important;
    width: 100% !important;
    padding: 0.9rem !important;
  }
  .settings-page.quota-page .quota-selector label {
    display: flex !important;
    align-items: center !important;
    gap: 0.5rem !important;
    width: 100% !important;
    margin: 0 !important;
  }
  .settings-page.quota-page .quota-selector select {
    display: block !important;
    width: 100% !important;
    max-width: none !important;
    margin: 0.55rem 0 0 !important;
  }
  .settings-page.quota-page .quota-stats {
    display: grid !important;
    grid-template-columns: 1fr !important;
    gap: 0.5rem !important;
    margin-bottom: 0.75rem !important;
  }
  .settings-page.quota-page .quota-edit-form {
    display: grid !important;
    grid-template-columns: 1fr !important;
    width: 100% !important;
    max-width: none !important;
    gap: 0.35rem !important;
  }
  .settings-page.quota-page .quota-edit-form label,
  .settings-page.quota-page .quota-edit-form input[type="number"],
  .settings-page.quota-page .quota-edit-form small {
    grid-column: 1 !important;
    width: 100% !important;
    max-width: none !important;
  }
  .settings-page.quota-page .quota-edit-form small {
    margin: 0 !important;
  }
  .settings-page.quota-page .quota-save-actions {
    display: flex !important;
    justify-content: flex-start !important;
    width: 100% !important;
    margin: 0.45rem 0 0 !important;
    padding-top: 0.65rem !important;
    border-top: 1px solid #E5EDF3 !important;
  }
  .settings-page.quota-page .quota-save-bottom {
    margin: 0 !important;
  }
}

/* Alignement commun des boutons Retour et Enregistrer, y compris sur mobile. */
.settings-page.quota-page .quota-save-actions {
  display: flex !important;
  flex-direction: row !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-wrap: nowrap !important;
  gap: 0.5rem !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

.settings-page.quota-page .quota-save-actions > .quota-back-button,
.settings-page.quota-page .quota-save-actions > .quota-save-bottom {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  width: auto !important;
  max-width: none !important;
  height: 2rem !important;
  min-height: 2rem !important;
  margin: 0 !important;
  line-height: 1 !important;
  flex: 0 0 auto !important;
  white-space: nowrap !important;
}

/* Refonte complète de la page des quotas EspaceSt. */
.settings-page.espacest-quota-page {
  display: block !important;
  width: calc(100% - 2rem) !important;
  max-width: 58rem !important;
  margin: 0 auto !important;
  text-align: left !important;
}

.settings-page.espacest-quota-page .espacest-quota-shell {
  width: 100% !important;
  box-sizing: border-box !important;
}

.settings-page.espacest-quota-page .espacest-quota-header {
  margin-bottom: 1.25rem !important;
}

.settings-page.espacest-quota-page .espacest-quota-header h1 {
  margin: 0 0 0.35rem !important;
  color: #17324D !important;
  font-size: 1.55rem !important;
}

.settings-page.espacest-quota-page .espacest-quota-intro {
  max-width: 42rem !important;
  margin: 0 !important;
  color: #64748B !important;
  line-height: 1.5 !important;
}

.settings-page.espacest-quota-page .espacest-user-actions {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0.6rem !important;
  width: 100% !important;
  margin: 1rem 0 0 !important;
  padding: 0 !important;
  visibility: visible !important;
  opacity: 1 !important;
}

.settings-page.espacest-quota-page .espacest-user-actions button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: max-content !important;
  min-height: 2.25rem !important;
  margin: 0 !important;
  padding: 0.45rem 0.9rem !important;
  box-sizing: border-box !important;
  border-radius: 0.55rem !important;
  visibility: visible !important;
  opacity: 1 !important;
  cursor: pointer !important;
  white-space: nowrap !important;
}

.settings-page.espacest-quota-page .espacest-settings-card,
.settings-page.espacest-quota-page .espacest-user-selector,
.settings-page.espacest-quota-page .espacest-user-quota-panel {
  width: 100% !important;
  box-sizing: border-box !important;
  margin: 0 0 1rem !important;
  padding: 1.25rem !important;
  border: 1px solid #D9E5EF !important;
  border-radius: 0.85rem !important;
  background: linear-gradient(135deg, #EAF4FC 0%, #F2EEFF 50%, #F0FDF4 100%) !important;
  box-shadow: 0 10px 26px rgba(23, 50, 77, 0.10) !important;
}

/* Un seul bloc, comme le formulaire complet de réservation. */
.settings-page.espacest-quota-page .espacest-quota-form-panel {
  width: 100% !important;
  box-sizing: border-box !important;
  margin: 2rem auto 0 !important;
  padding: 1.25rem !important;
  border: 1px solid #D9E2EC !important;
  border-radius: 14px !important;
  background: linear-gradient(135deg, #EAF4FC 0%, #F2EEFF 50%, #F0FDF4 100%) !important;
  box-shadow: 0 10px 26px rgba(23, 50, 77, 0.10) !important;
}

.settings-page.espacest-quota-page .espacest-quota-form-panel > .espacest-quota-header {
  margin: 0 0 1rem !important;
  padding: 0 0 0.75rem !important;
  border-bottom: 1px solid #E2E8F0 !important;
}

.settings-page.espacest-quota-page .espacest-quota-form-panel .espacest-settings-card,
.settings-page.espacest-quota-page .espacest-quota-form-panel .espacest-user-selector,
.settings-page.espacest-quota-page .espacest-quota-form-panel .espacest-user-quota-panel {
  margin: 0 0 1rem !important;
  padding: 1rem 0 !important;
  border: 0 !important;
  border-bottom: 1px solid #E2E8F0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.settings-page.espacest-quota-page .espacest-quota-form-panel .espacest-user-quota-panel {
  margin-bottom: 0 !important;
  border-bottom: 0 !important;
}

.settings-page.espacest-quota-page .espacest-feature-settings h2,
.settings-page.espacest-quota-page .espacest-select-title {
  margin: 0 0 0.5rem !important;
  color: #17324D !important;
  font-size: 1rem !important;
}

.settings-page.espacest-quota-page .espacest-card-description {
  margin: 0 0 0.8rem !important;
  color: #64748B !important;
}

.settings-page.espacest-quota-page .espacest-user-selector {
  display: grid !important;
  grid-template-columns: 2rem minmax(0, 1fr) !important;
  gap: 0.55rem 0.75rem !important;
  align-items: center !important;
}

.settings-page.espacest-quota-page .espacest-user-selector label {
  grid-column: 2 !important;
  margin: 0 !important;
  color: #17324D !important;
  font-weight: 700 !important;
}

.settings-page.espacest-quota-page .espacest-user-selector select {
  grid-column: 1 / -1 !important;
  width: 100% !important;
  min-height: 2.5rem !important;
  box-sizing: border-box !important;
}

.settings-page.espacest-quota-page .espacest-step {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 1.8rem !important;
  height: 1.8rem !important;
  border-radius: 50% !important;
  background: #E2F3F1 !important;
  color: #18746E !important;
  font-size: 0.72rem !important;
  font-weight: 800 !important;
}

.settings-page.espacest-quota-page .espacest-user-heading {
  display: flex !important;
  align-items: center !important;
  gap: 0.75rem !important;
  margin-bottom: 1rem !important;
  padding-bottom: 0.9rem !important;
  border-bottom: 1px solid #E5EDF3 !important;
}

.settings-page.espacest-quota-page .espacest-eyebrow {
  display: block !important;
  color: #64748B !important;
  font-size: 0.78rem !important;
}

.settings-page.espacest-quota-page .espacest-user-heading h3 {
  margin: 0.15rem 0 0 !important;
  color: #17324D !important;
  font-size: 1.25rem !important;
}

.settings-page.espacest-quota-page .espacest-quota-stats {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0.75rem !important;
  margin-bottom: 1.25rem !important;
}

.settings-page.espacest-quota-page .espacest-stat {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 1rem !important;
  min-height: 3.5rem !important;
  padding: 0.8rem 1rem !important;
  box-sizing: border-box !important;
  border-radius: 0.65rem !important;
  background: #F3F8FB !important;
  color: #536579 !important;
}

.settings-page.espacest-quota-page .espacest-stat strong {
  color: #17324D !important;
  font-size: 1.2rem !important;
}

.settings-page.espacest-quota-page .espacest-quota-fields {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 12rem !important;
  align-items: center !important;
  gap: 0.5rem 1rem !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 1rem !important;
  box-sizing: border-box !important;
  border: 1px solid #E2E8F0 !important;
  border-radius: 12px !important;
  background: #F8FAFC !important;
}

.settings-page.espacest-quota-page .espacest-quota-fields label {
  grid-column: 1 !important;
  color: #17324D !important;
  font-weight: 700 !important;
}

.settings-page.espacest-quota-page .espacest-quota-fields input[type="number"] {
  grid-column: 2 !important;
  grid-row: 1 / span 2 !important;
  width: 12rem !important;
  box-sizing: border-box !important;
}

.settings-page.espacest-quota-page .espacest-quota-fields small {
  grid-column: 1 !important;
  color: #64748B !important;
}

.settings-page.espacest-quota-page .espacest-quota-actions {
  display: flex !important;
  flex-flow: row nowrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0.6rem !important;
  width: 100% !important;
  margin: 1rem 0 0 !important;
  padding: 0 !important;
  border: 0 !important;
  white-space: nowrap !important;
}

.settings-page.espacest-quota-page .espacest-quota-actions button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: max-content !important;
  max-width: none !important;
  min-height: 2.25rem !important;
  margin: 0 !important;
  padding: 0.45rem 0.9rem !important;
  box-sizing: border-box !important;
  border-radius: 0.55rem !important;
  white-space: nowrap !important;
  cursor: pointer !important;
}

.settings-page.espacest-quota-page .espacest-quota-back {
  border: 1px solid #CBD5E1 !important;
  background: #F8FAFC !important;
  color: #17324D !important;
}

.settings-page.espacest-quota-page .espacest-quota-save {
  border: 1px solid #238B83 !important;
  background: #238B83 !important;
  color: #FFFFFF !important;
}

@media (max-width: 40rem) {
  .settings-page.espacest-quota-page {
    width: calc(100% - 1.25rem) !important;
    margin-left: auto !important;
    margin-right: auto !important;
  }

  .settings-page.espacest-quota-page .espacest-settings-card,
  .settings-page.espacest-quota-page .espacest-user-selector,
.settings-page.espacest-quota-page .espacest-user-quota-panel {
    padding: 1rem !important;
  }

  .settings-page.espacest-quota-page .espacest-quota-stats,
  .settings-page.espacest-quota-page .espacest-quota-fields {
    grid-template-columns: 1fr !important;
  }

  .settings-page.espacest-quota-page .espacest-quota-fields input[type="number"],
  .settings-page.espacest-quota-page .espacest-quota-fields label,
  .settings-page.espacest-quota-page .espacest-quota-fields small {
    grid-column: 1 !important;
    grid-row: auto !important;
    width: 100% !important;
  }
}

/* Mise en page EspaceSt dédiée au bloc utilisateur et à son quota. */
.settings-page.quota-page .espacest-user-quota-panel {
  display: block !important;
  width: 100% !important;
  max-width: 42rem !important;
  box-sizing: border-box !important;
  margin: 1rem 0 0 !important;
  padding: 1.25rem !important;
  border: 1px solid #D9E5EF !important;
  border-radius: 0.85rem !important;
  background: #FFFFFF !important;
  box-shadow: 0 7px 18px rgba(23, 50, 77, 0.08) !important;
}

.settings-page.quota-page .espacest-user-heading {
  display: flex !important;
  align-items: center !important;
  gap: 0.75rem !important;
  margin: 0 0 1rem !important;
  padding: 0 0 0.9rem !important;
  border-bottom: 1px solid #E5EDF3 !important;
}

.settings-page.quota-page .espacest-quota-stats {
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0.75rem !important;
  margin: 0 0 1.25rem !important;
}

.settings-page.quota-page .espacest-quota-fields {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 12rem !important;
  align-items: center !important;
  gap: 0.5rem 1rem !important;
  width: 100% !important;
  max-width: none !important;
  padding-top: 0 !important;
}

.settings-page.quota-page .espacest-quota-fields label {
  grid-column: 1 !important;
  width: auto !important;
}

.settings-page.quota-page .espacest-quota-fields input[type="number"] {
  grid-column: 2 !important;
  grid-row: 1 / span 2 !important;
  width: 12rem !important;
  max-width: 100% !important;
}

.settings-page.quota-page .espacest-quota-fields small {
  grid-column: 1 !important;
  width: auto !important;
  max-width: none !important;
}

.settings-page.quota-page .espacest-quota-actions {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0.6rem !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 0 1.1rem !important;
  padding: 0 0 1rem !important;
  border-bottom: 1px solid #E5EDF3 !important;
  white-space: nowrap !important;
}

.settings-page.quota-page .espacest-quota-actions > .espacest-quota-back,
.settings-page.quota-page .espacest-quota-actions > .espacest-quota-save {
  display: inline-flex !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: max-content !important;
  max-width: none !important;
  margin: 0 !important;
  white-space: nowrap !important;
}

@media (max-width: 40rem) {
  .settings-page.quota-page .espacest-user-quota-panel {
    padding: 1rem !important;
  }

  .settings-page.quota-page .espacest-quota-stats,
  .settings-page.quota-page .espacest-quota-fields {
    grid-template-columns: 1fr !important;
  }

  .settings-page.quota-page .espacest-quota-fields input[type="number"],
  .settings-page.quota-page .espacest-quota-fields label,
  .settings-page.quota-page .espacest-quota-fields small {
    grid-column: 1 !important;
    grid-row: auto !important;
    width: 100% !important;
  }
}

.settings-page.quota-page .quota-save-actions > .quota-back-button {
  order: 1 !important;
}

.settings-page.quota-page .quota-save-actions > .quota-save-bottom {
  order: 2 !important;
}

@media (max-width: 40rem) {
  .settings-page.quota-page .quota-save-actions {
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    align-items: center !important;
  }
}

/* Présentation aérée et intuitive de la sélection et de l'utilisateur choisi. */
.settings-page.quota-page .quota-search-title {
  margin-top: 1.5rem !important;
  margin-bottom: 0.65rem !important;
  padding: 0 0.25rem !important;
  border: 0 !important;
  font-size: 1.05rem !important;
}

.settings-page.quota-page .quota-selector {
  display: grid !important;
  grid-template-columns: 2rem minmax(0, 1fr) !important;
  gap: 0.55rem 0.75rem !important;
  align-items: center !important;
  margin: 0 0 1.5rem !important;
  padding: 1.15rem 1.25rem !important;
  border: 1px solid #D9E5EF !important;
  border-radius: 0.85rem !important;
  background: #F8FBFD !important;
  box-shadow: 0 5px 14px rgba(23, 50, 77, 0.07) !important;
}

.settings-page.quota-page .quota-selector .quota-step-number {
  display: inline-flex !important;
  position: static !important;
  grid-column: 1 !important;
  grid-row: 1 !important;
}

.settings-page.quota-page .quota-selector label {
  grid-column: 2 !important;
  grid-row: 1 !important;
  width: auto !important;
  margin: 0 !important;
  font-size: 0.9rem !important;
}

.settings-page.quota-page .quota-selector select {
  grid-column: 1 / -1 !important;
  grid-row: 2 !important;
  width: 100% !important;
  max-width: none !important;
  min-height: 2.75rem !important;
  height: 2.75rem !important;
  padding: 0.55rem 0.75rem !important;
  font-size: 0.9rem !important;
}

.settings-page.quota-page .quota-edit-card {
  margin: 2rem 0 0 !important;
  padding: 2rem !important;
  border: 1px solid #D9E5EF !important;
  border-radius: 0.85rem !important;
  background: #FFFFFF !important;
  box-shadow: 0 7px 18px rgba(23, 50, 77, 0.08) !important;
}

.settings-page.quota-page .quota-user-heading {
  margin-bottom: 1.75rem !important;
  padding-bottom: 1.15rem !important;
  border-bottom: 1px solid #E5EDF3 !important;
}

.settings-page.quota-page .quota-user-heading h3 {
  margin-top: 0.4rem !important;
  font-size: 1.35rem !important;
}

.settings-page.quota-page .quota-stats {
  grid-template-columns: 1fr !important;
  gap: 0.9rem !important;
  margin-bottom: 1.75rem !important;
}

.settings-page.quota-page .quota-stat {
  min-height: 4rem !important;
  padding: 1rem 1.15rem !important;
  border-radius: 0.7rem !important;
}

.settings-page.quota-page .quota-edit-form {
  grid-template-columns: minmax(0, 1fr) !important;
  width: 100% !important;
  max-width: none !important;
  gap: 0.75rem !important;
  padding-top: 1.5rem !important;
}

.settings-page.quota-page .quota-edit-form label,
.settings-page.quota-page .quota-edit-form input[type="number"],
.settings-page.quota-page .quota-edit-form small {
  grid-column: 1 !important;
  width: 100% !important;
  max-width: none !important;
}

.settings-page.quota-page .quota-edit-form input[type="number"] {
  height: 3rem !important;
  min-height: 3rem !important;
  font-size: 1rem !important;
}

.settings-page.quota-page .quota-edit-form small {
  margin-top: 0.25rem !important;
  line-height: 1.45 !important;
}

@media (max-width: 40rem) {
  .settings-page.quota-page .quota-selector,
  .settings-page.quota-page .quota-edit-card {
    padding: 1rem !important;
  }

  .settings-page.quota-page .quota-edit-card {
    margin-top: 1.25rem !important;
    padding: 1.25rem !important;
  }
}

/* Priorité finale : les deux actions doivent rester sur la même ligne. */
.settings-page.quota-page .quota-save-actions {
  display: grid !important;
  grid-template-columns: max-content max-content !important;
  grid-auto-flow: column !important;
  align-items: center !important;
  justify-content: start !important;
  column-gap: 0.5rem !important;
  width: max-content !important;
  max-width: 100% !important;
  white-space: nowrap !important;
}

.settings-page.quota-page .quota-save-actions > .quota-back-button,
.settings-page.quota-page .quota-save-actions > .quota-save-bottom {
  grid-column: auto !important;
  grid-row: 1 !important;
  justify-self: start !important;
  width: max-content !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  white-space: nowrap !important;
}

/* Priorité finale : bouton Effacer une réservation ciblé par son action. */
html body .contents .booking-detail-page #view_entry_nav form[action*="del_entry.php"] input[type="submit"] {
  opacity: 1 !important;
  border: 1px solid #B74740 !important;
  background-color: #C95B52 !important;
  background-image: none !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  box-shadow: 0 5px 12px rgba(183, 71, 64, 0.3) !important;
  appearance: none !important;
}

html body .contents .booking-detail-page #view_entry_nav form[action*="del_entry.php"] input[type="submit"]:hover,
html body .contents .booking-detail-page #view_entry_nav form[action*="del_entry.php"] input[type="submit"]:focus {
  border-color: #963730 !important;
  background-color: #AD463E !important;
  background-image: none !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  box-shadow: 0 7px 16px rgba(150, 55, 48, 0.36) !important;
}

/* ==========================================================================
 * Mes réservations : panneau compact et liste professionnelle.
 * ========================================================================== */

.settings-page.user-report-page {
  box-sizing: border-box;
  width: calc(100% - 2rem);
  max-width: 46rem !important;
  margin: 1.25rem auto 2rem !important;
  padding: 0 0 1rem !important;
  overflow: hidden;
  border: 1px solid #D8E2EC;
  border-radius: 18px;
  background: #F8FAFC;
  box-shadow: 0 16px 38px rgba(23, 50, 77, 0.1);
  color: #17324D;
}

.user-report-page .user-report-header {
  padding: 1rem;
  border-bottom: 1px solid #D8E2EC;
  background: linear-gradient(125deg, #EAF5FF 0%, #F1EEFF 51%, #EAF9F1 100%);
}

.user-report-page .user-report-heading {
  display: flex;
  align-items: center;
  gap: 0.65rem;
}

.user-report-page .user-report-title-icon {
  display: inline-flex;
  flex: 0 0 2.15rem;
  align-items: center;
  justify-content: center;
  width: 2.15rem;
  height: 2.15rem;
  border: 1px solid rgba(60, 140, 204, 0.22);
  border-radius: 11px;
  background: rgba(255, 255, 255, 0.82);
  color: #2F78AD;
  box-shadow: 0 5px 13px rgba(47, 120, 173, 0.14);
}

.user-report-page .user-report-title-icon svg,
.user-report-page .user-report-empty-icon svg {
  width: 1.2rem;
  height: 1.2rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.user-report-page .user-report-heading h2 {
  flex: 1 1 auto;
  margin: 0 !important;
  color: #17324D !important;
  font-size: 1.08rem !important;
  font-weight: 750 !important;
  line-height: 1.25;
}

.user-report-page .user-report-count {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  min-width: 1.75rem;
  height: 1.75rem;
  box-sizing: border-box;
  padding: 0 0.5rem;
  border: 1px solid #B9DEC9;
  border-radius: 999px;
  background: #ECF9F2;
  color: #256747;
  box-shadow: 0 4px 10px rgba(37, 103, 71, 0.12);
  font-size: 0.75rem;
  font-weight: 750;
}

.user-report-page .user-report-intro {
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
  margin: 0.75rem 0 0 !important;
  padding: 0.6rem 0.7rem;
  border: 1px solid rgba(60, 140, 204, 0.18);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.62);
  color: #496278;
}

.user-report-page .user-report-intro p {
  margin: 0;
  font-size: 0.79rem;
  line-height: 1.5;
}

.user-report-page .user-report-info-icon {
  display: inline-flex;
  flex: 0 0 1.2rem;
  align-items: center;
  justify-content: center;
  width: 1.2rem;
  height: 1.2rem;
  margin-top: 0.05rem;
  border-radius: 50%;
  background: #DCEEFF;
  color: #2F78AD;
  font-size: 0.7rem;
  font-weight: 800;
  font-style: normal;
}

.user-report-page .user-report-table-wrap {
  width: auto;
  margin: 1rem 1rem 0;
  overflow: hidden;
  border: 1px solid #D8E2EC;
  border-radius: 13px;
  background: #FFFFFF;
  box-shadow: 0 7px 18px rgba(23, 50, 77, 0.07);
}

.user-report-page .user-report-table {
  width: 100%;
  min-width: 0;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  color: #17324D;
  font-size: 0.78rem !important;
}

.user-report-page .user-report-table th {
  height: auto !important;
  padding: 0.65rem 0.7rem !important;
  border: 0 !important;
  border-bottom: 1px solid #D8E2EC !important;
  background: #EEF5FA;
  color: #3D5870;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.035em;
  text-align: left;
  text-transform: uppercase;
  white-space: nowrap;
}

.user-report-page .user-report-table td {
  height: auto !important;
  padding: 0.72rem 0.7rem !important;
  overflow: visible !important;
  border: 0 !important;
  border-bottom: 1px solid #E7EDF3 !important;
  background: #FFFFFF;
  text-align: left;
  vertical-align: middle;
  white-space: normal;
  transition: background-color 160ms ease;
}

.user-report-page .user-report-table tr:last-child td {
  border-bottom: 0 !important;
}

.user-report-page .user-report-table tbody tr:hover td {
  background: #F6FAFD;
}

.user-report-page .user-report-table tbody tr.is-past td {
  background: #FCFDFE;
}

.user-report-page .user-report-table tbody tr.is-past:hover td {
  background: #F5F8FA;
}

.user-report-page .user-report-table td:first-child {
  position: relative;
  padding-left: 0.95rem !important;
}

.user-report-page .user-report-table td:first-child::before {
  content: "";
  position: absolute;
  top: 0.72rem;
  bottom: 0.72rem;
  left: 0;
  width: 3px;
  border-radius: 999px;
  background: #72C69A;
}

.user-report-page .user-report-table tr.is-past td:first-child::before {
  background: #B8C5D0;
}

.user-report-page .user-report-table strong {
  font-weight: 750;
}

.user-report-page .user-report-table strong a {
  display: inline-flex;
  align-items: center;
  gap: 0.2rem;
  color: #246E9F;
  text-decoration: none;
}

.user-report-page .user-report-table strong a:hover,
.user-report-page .user-report-table strong a:focus {
  color: #174F77;
  text-decoration: underline;
}

.user-report-page .user-report-link-icon {
  width: 0.9rem;
  height: 0.9rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
  transition: transform 160ms ease;
}

.user-report-page .user-report-table strong a:hover .user-report-link-icon,
.user-report-page .user-report-table strong a:focus .user-report-link-icon {
  transform: translateX(2px);
}

.user-report-page .user-report-description {
  display: block !important;
  max-width: 16rem;
  margin-top: 0.18rem;
  overflow: hidden;
  color: #687B8C !important;
  font-size: 0.7rem !important;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.user-report-page .user-report-table time {
  display: inline-flex;
  flex-direction: column;
  gap: 0.08rem;
  color: #29465F;
  line-height: 1.2;
  white-space: nowrap;
}

.user-report-page .user-report-table time small {
  color: #718397;
  font-size: 0.68rem;
  font-weight: 650;
}

.user-report-page .user-report-room {
  display: inline-flex;
  align-items: center;
  gap: 0.3rem;
  color: #496278;
  white-space: nowrap;
}

.user-report-page .user-report-room svg {
  width: 0.95rem;
  height: 0.95rem;
  fill: none;
  stroke: #6C8CA4;
  stroke-width: 1.75;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.user-report-page .user-report-empty {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  margin: 1rem;
  padding: 0.9rem;
  border: 1px dashed #C8D7E3;
  border-radius: 12px;
  background: #FFFFFF;
  color: #536579;
}

.user-report-page .user-report-empty p {
  margin: 0;
  font-size: 0.82rem;
}

.user-report-page .user-report-empty-icon {
  display: inline-flex;
  flex: 0 0 2rem;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 10px;
  background: #EEF5FA;
  color: #64849C;
}

@media (max-width: 44rem) {
  .settings-page.user-report-page {
    width: calc(100% - 1rem);
    margin-top: 0.75rem !important;
  }

  .user-report-page .user-report-header {
    padding: 0.85rem;
  }

  .user-report-page .user-report-table-wrap {
    margin: 0.75rem 0.75rem 0;
    overflow: visible;
    border: 0;
    background: transparent;
    box-shadow: none;
  }

  .user-report-page .user-report-table,
  .user-report-page .user-report-table tbody,
  .user-report-page .user-report-table tr,
  .user-report-page .user-report-table td {
    display: block;
    width: 100%;
    min-width: 0 !important;
    box-sizing: border-box;
  }

  .user-report-page .user-report-table thead {
    display: none;
  }

  .user-report-page .user-report-table tr {
    margin-bottom: 0.7rem;
    overflow: hidden;
    border: 1px solid #D8E2EC;
    border-radius: 12px;
    background: #FFFFFF;
    box-shadow: 0 5px 13px rgba(23, 50, 77, 0.06);
  }

  .user-report-page .user-report-table td {
    display: grid;
    grid-template-columns: 6.8rem minmax(0, 1fr);
    gap: 0.5rem;
    align-items: center;
    padding: 0.55rem 0.7rem !important;
  }

  .user-report-page .user-report-table td::before {
    content: attr(data-label);
    color: #687B8C;
    font-size: 0.65rem;
    font-weight: 800;
    letter-spacing: 0.025em;
    text-transform: uppercase;
  }

  .user-report-page .user-report-table td:first-child {
    display: block;
    padding: 0.75rem 0.75rem 0.65rem 0.95rem !important;
  }

  .user-report-page .user-report-table td:first-child::before {
    content: "";
    top: 0.65rem;
    bottom: 0.65rem;
    width: 3px;
  }

  .user-report-page .user-report-description {
    max-width: 100%;
  }
}

/* Mes réservations : chaque élément de la liste ouvre sa fiche complète. */
.user-report-page .user-report-list {
  margin: 1rem 1rem 0;
  padding: 0;
  overflow: hidden;
  border: 1px solid #D8E2EC;
  border-radius: 13px;
  background: #FFFFFF;
  box-shadow: 0 7px 18px rgba(23, 50, 77, 0.08);
}

.user-report-page .user-report-list-row {
  margin: 0;
  padding: 0;
  border: 0;
  border-bottom: 1px solid #E3EAF0;
  list-style: none;
}

.user-report-page .user-report-list-row:last-child {
  border-bottom: 0;
}

.user-report-page a.user-report-list-item {
  position: relative;
  display: grid !important;
  grid-template-columns: minmax(9rem, 1fr) minmax(18rem, 1.35fr) 1.8rem;
  gap: 0.8rem;
  align-items: center;
  min-height: 4.4rem;
  box-sizing: border-box;
  padding: 0.72rem 0.65rem 0.72rem 0.9rem;
  border: 0;
  border-bottom: 0;
  background: #FFFFFF;
  color: #17324D !important;
  text-decoration: none !important;
  transition: background-color 160ms ease, box-shadow 160ms ease;
}

.user-report-page a.user-report-list-item::before {
  content: "";
  position: absolute;
  top: 0.75rem;
  bottom: 0.75rem;
  left: 0;
  width: 3px;
  border-radius: 0 999px 999px 0;
  background: #72C69A;
}

.user-report-page a.user-report-list-item.is-past::before {
  background: #B8C5D0;
}

.user-report-page a.user-report-list-item:hover,
.user-report-page a.user-report-list-item:focus-visible {
  z-index: 1;
  outline: 0;
  background: #F1F8FD;
  box-shadow: inset 0 0 0 1px rgba(60, 140, 204, 0.2);
}

.user-report-page .user-report-item-main,
.user-report-page .user-report-item-details {
  display: flex;
  min-width: 0;
}

.user-report-page .user-report-item-main {
  flex-direction: column;
  gap: 0.22rem;
}

.user-report-page .user-report-item-title {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 0.4rem;
}

.user-report-page .user-report-item-title strong {
  overflow: hidden;
  color: #246E9F;
  font-size: 0.81rem;
  font-weight: 760;
  line-height: 1.3;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.user-report-page .user-report-status-dot {
  flex: 0 0 0.48rem;
  width: 0.48rem;
  height: 0.48rem;
  border-radius: 50%;
  background: #5DB788;
  box-shadow: 0 0 0 3px #E5F6ED;
}

.user-report-page .is-past .user-report-status-dot {
  background: #9BABB8;
  box-shadow: 0 0 0 3px #EDF1F4;
}

.user-report-page .user-report-description {
  display: block !important;
  max-width: 100%;
  margin: 0 0 0 0.88rem;
  overflow: hidden;
  color: #687B8C !important;
  font-size: 0.69rem !important;
  line-height: 1.35;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.user-report-page .user-report-item-details {
  flex-direction: column;
  gap: 0.38rem;
  padding-left: 0.8rem;
  border-left: 1px solid #E3EAF0;
}

.user-report-page .user-report-dates {
  display: flex;
  align-items: center;
  gap: 0.45rem;
}

.user-report-page .user-report-date {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 0.08rem;
}

.user-report-page .user-report-date small {
  color: #718397;
  font-size: 0.57rem;
  font-weight: 800;
  letter-spacing: 0.035em;
  line-height: 1;
  text-transform: uppercase;
}

.user-report-page .user-report-date time {
  color: #29465F;
  font-size: 0.7rem;
  line-height: 1.25;
  white-space: nowrap;
}

.user-report-page .user-report-date time b {
  color: #246E9F;
  font-weight: 760;
}

.user-report-page .user-report-date-arrow {
  flex: 0 0 0.8rem;
  width: 0.8rem;
  height: 0.8rem;
  fill: none;
  stroke: #8AA0B2;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.user-report-page .user-report-room {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  gap: 0.3rem;
  overflow: hidden;
  color: #5D7184;
  font-size: 0.66rem;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.user-report-page .user-report-room svg {
  flex: 0 0 0.85rem;
  width: 0.85rem;
  height: 0.85rem;
}

.user-report-page .user-report-open-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.55rem;
  height: 1.55rem;
  border: 1px solid #CEE0ED;
  border-radius: 50%;
  background: #F7FBFE;
  color: #3C8CCC;
  transition: color 160ms ease, background-color 160ms ease, transform 160ms ease;
}

.user-report-page .user-report-open-icon svg {
  width: 0.85rem;
  height: 0.85rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.user-report-page a.user-report-list-item:hover .user-report-open-icon,
.user-report-page a.user-report-list-item:focus-visible .user-report-open-icon {
  background: #E5F3FC;
  color: #246E9F;
  transform: translateX(2px);
}

@media (max-width: 44rem) {
  .user-report-page .user-report-list {
    margin: 0.75rem 0.75rem 0;
  }

  .user-report-page a.user-report-list-item {
    grid-template-columns: minmax(0, 1fr) 1.8rem;
    gap: 0.65rem;
    padding: 0.75rem 0.65rem 0.75rem 0.9rem;
  }

  .user-report-page .user-report-item-details {
    grid-column: 1;
    padding: 0.55rem 0 0 0.88rem;
    border-top: 1px solid #E7EDF3;
    border-left: 0;
  }

  .user-report-page .user-report-open-icon {
    grid-column: 2;
    grid-row: 1 / span 2;
  }
}

@media (max-width: 28rem) {
  .user-report-page .user-report-dates {
    align-items: flex-start;
    flex-direction: column;
    gap: 0.35rem;
  }

  .user-report-page .user-report-date-arrow {
    display: none;
  }
}

/* Couleur unique pour toutes les réservations. */
.user-report-page .user-report-list-row {
  --reservation-bg: #F4FAFF;
  --reservation-hover: #E8F5FF;
  --reservation-accent: #5B9FCE;
  --reservation-accent-soft: #DDEFFC;
}

.user-report-page .user-report-list-row a.user-report-list-item {
  background: var(--reservation-bg) !important;
}

.user-report-page .user-report-list-row a.user-report-list-item::before {
  background: var(--reservation-accent) !important;
}

.user-report-page .user-report-list-row a.user-report-list-item:hover,
.user-report-page .user-report-list-row a.user-report-list-item:focus-visible {
  background: var(--reservation-hover) !important;
  box-shadow: inset 0 0 0 1px var(--reservation-accent-soft);
}

.user-report-page .user-report-list-row .user-report-status-dot {
  background: var(--reservation-accent);
  box-shadow: 0 0 0 3px var(--reservation-accent-soft);
}

.user-report-page .user-report-list-row .user-report-open-icon {
  border-color: var(--reservation-accent-soft);
  background: rgba(255, 255, 255, 0.72);
  color: var(--reservation-accent);
}

.user-report-page .user-report-list-row a.user-report-list-item:hover .user-report-open-icon,
.user-report-page .user-report-list-row a.user-report-list-item:focus-visible .user-report-open-icon {
  background: var(--reservation-accent-soft);
  color: var(--reservation-accent);
}

/* Version compacte : informations essentielles sans le nom de la salle. */
.user-report-page .user-report-list {
  margin-top: 0.75rem;
}

.user-report-page a.user-report-list-item {
  grid-template-columns: minmax(8rem, 1fr) max-content 1.5rem;
  gap: 0.6rem;
  min-height: 3.25rem;
  padding: 0.45rem 0.55rem 0.45rem 0.8rem;
}

.user-report-page a.user-report-list-item::before {
  top: 0.5rem;
  bottom: 0.5rem;
}

.user-report-page .user-report-item-main {
  gap: 0.12rem;
}

.user-report-page .user-report-item-title strong {
  font-size: 0.77rem;
}

.user-report-page .user-report-description {
  margin-left: 0.86rem;
  font-size: 0.64rem !important;
}

.user-report-page .user-report-item-details {
  display: block;
  padding-left: 0.65rem;
}

.user-report-page .user-report-dates {
  gap: 0.35rem;
}

.user-report-page .user-report-date {
  gap: 0;
}

.user-report-page .user-report-date small {
  font-size: 0.52rem;
}

.user-report-page .user-report-date time {
  font-size: 0.66rem;
}

.user-report-page .user-report-open-icon {
  width: 1.35rem;
  height: 1.35rem;
}

@media (max-width: 44rem) {
  .user-report-page a.user-report-list-item {
    grid-template-columns: minmax(0, 1fr) 1.5rem;
    gap: 0.45rem;
    min-height: 3rem;
    padding: 0.5rem 0.5rem 0.5rem 0.8rem;
  }

  .user-report-page .user-report-item-details {
    padding: 0.35rem 0 0 0.86rem;
  }
}

/* Une information par niveau : titre puis date sur la ligne inférieure. */
.user-report-page a.user-report-list-item {
  grid-template-columns: minmax(0, 1fr) 1.5rem;
  gap: 0.5rem;
}

.user-report-page .user-report-item-main {
  gap: 0.28rem;
}

.user-report-page .user-report-item-date {
  display: flex;
  align-items: center;
  min-width: 0;
  margin-left: 0.86rem;
  gap: 0.28rem;
  color: #607589;
  font-size: 0.65rem;
  line-height: 1.2;
  white-space: nowrap;
}

.user-report-page .user-report-item-date svg {
  flex: 0 0 0.78rem;
  width: 0.78rem;
  height: 0.78rem;
  fill: none;
  stroke: var(--reservation-accent);
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.user-report-page .user-report-item-date time {
  color: inherit;
  font: inherit;
}

.user-report-page .user-report-open-icon {
  grid-column: 2;
  grid-row: 1;
}

/* ==========================================================================
 * Détails de la réservation : même identité que les formulaires EspaceSt.
 * ========================================================================== */

.view_entry .booking-detail-page {
  box-sizing: border-box;
  width: calc(100% - 2rem);
  max-width: 46rem;
  margin: 1.25rem auto 2rem;
  padding: 0 0 1rem;
  overflow: hidden;
  border: 1px solid #D8E2EC;
  border-radius: 18px;
  background: #F8FAFC;
  box-shadow: 0 16px 38px rgba(23, 50, 77, 0.1);
  color: #17324D;
}

.view_entry .booking-detail-header {
  padding: 1rem;
  border-bottom: 1px solid #D8E2EC;
  background: linear-gradient(125deg, #EAF5FF 0%, #F1EEFF 51%, #EAF9F1 100%);
}

.view_entry .booking-detail-heading {
  display: flex;
  align-items: center;
  gap: 0.65rem;
}

.view_entry .booking-detail-title-icon {
  display: inline-flex;
  flex: 0 0 2.15rem;
  align-items: center;
  justify-content: center;
  width: 2.15rem;
  height: 2.15rem;
  border: 1px solid rgba(60, 140, 204, 0.22);
  border-radius: 11px;
  background: rgba(255, 255, 255, 0.82);
  color: #2F78AD;
  box-shadow: 0 5px 13px rgba(47, 120, 173, 0.14);
}

.view_entry .booking-detail-title-icon svg {
  width: 1.2rem;
  height: 1.2rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.view_entry .booking-detail-heading h2 {
  margin: 0 !important;
  color: #17324D !important;
  font-size: 1.08rem !important;
  font-weight: 750 !important;
  line-height: 1.25;
}

.view_entry .booking-detail-name {
  margin: 0.65rem 0 0 2.8rem !important;
  color: #246E9F !important;
  font-size: 0.84rem !important;
  font-weight: 720 !important;
  line-height: 1.35;
}

.view_entry .booking-detail-page #entry {
  width: calc(100% - 2rem);
  box-sizing: border-box;
  margin: 1rem;
  padding: 0 !important;
  overflow: hidden;
  border: 1px solid #D8E2EC;
  border-collapse: separate;
  border-spacing: 0;
  border-radius: 13px;
  background: #FFFFFF;
  box-shadow: 0 7px 18px rgba(23, 50, 77, 0.07);
}

.view_entry .booking-detail-page #entry td {
  box-sizing: border-box;
  padding: 0.62rem 0.75rem !important;
  border: 0;
  border-bottom: 1px solid #E7EDF3;
  background: #FFFFFF;
  color: #29465F;
  font-size: 0.76rem;
  line-height: 1.4;
  text-align: left;
  vertical-align: top;
}

.view_entry .booking-detail-page #entry tr:last-child td {
  border-bottom: 0;
}

.view_entry .booking-detail-page #entry td:first-child {
  width: 36%;
  padding-right: 0.75rem !important;
  background: #F3F8FC;
  color: #587085;
  font-size: 0.68rem;
  font-weight: 780;
  letter-spacing: 0.02em;
  text-align: left;
}

.view_entry .booking-detail-page #entry a {
  color: #246E9F;
  font-weight: 700;
}

.view_entry .booking-detail-page > h4,
.view_entry .booking-detail-page #registration + h4 {
  margin: 1rem 1rem 0.55rem !important;
  color: #35536B;
  font-size: 0.76rem !important;
  font-weight: 780;
}

.view_entry .booking-detail-page #registration {
  box-sizing: border-box;
  margin: 0 1rem 1rem;
  padding: 0.75rem !important;
  border: 1px solid #D8E2EC;
  border-radius: 12px;
  background: #FFFFFF;
  box-shadow: 0 6px 15px rgba(23, 50, 77, 0.06);
}

.view_entry .booking-detail-page #registration .list {
  margin: 0 0 0.6rem;
}

.view_entry .booking-detail-page #registration .list td {
  padding: 0.35rem 0.55rem;
  color: #3D5870;
  font-size: 0.72rem;
  text-align: left;
}

.view_entry .booking-detail-page div#view_entry_nav {
  display: flex !important;
  align-items: center;
  justify-content: flex-start;
  gap: 0.45rem;
  width: auto;
  margin: 1rem 0 0 !important;
  padding: 0.85rem 1rem 0;
  border-top: 1px solid #D8E2EC;
}

.view_entry .booking-detail-page div#view_entry_nav > div {
  display: flex !important;
  align-items: center;
  gap: 0.45rem;
}

.view_entry .booking-detail-page div#view_entry_nav > div > div {
  display: block !important;
  padding: 0 !important;
}

.view_entry .booking-detail-page #view_entry_nav form {
  display: inline-block;
  margin: 0;
}

.view_entry .booking-detail-page #view_entry_nav input[type="submit"] {
  width: auto !important;
  min-width: 0;
  height: 1.75rem;
  min-height: 1.75rem;
  box-sizing: border-box;
  margin: 0;
  padding: 0.2rem 0.75rem;
  border: 1px solid #2F78AD;
  border-radius: 999px;
  background: #3C8CCC;
  color: #FFFFFF;
  box-shadow: 0 5px 12px rgba(47, 120, 173, 0.24);
  font-size: 0.7rem;
  font-weight: 750;
}

.view_entry .booking-detail-page #view_entry_nav input[type="submit"]:hover,
.view_entry .booking-detail-page #view_entry_nav input[type="submit"]:focus {
  border-color: #235F89;
  background: #2F78AD;
  box-shadow: 0 7px 16px rgba(47, 120, 173, 0.3);
}

.view_entry .booking-detail-page #view_entry_nav > div:nth-child(2) input[type="submit"] {
  border-color: #B74740;
  background: #C95B52;
  color: #FFFFFF;
  box-shadow: 0 5px 12px rgba(183, 71, 64, 0.28);
}

.view_entry .booking-detail-page #view_entry_nav > div:nth-child(2) input[type="submit"]:hover,
.view_entry .booking-detail-page #view_entry_nav > div:nth-child(2) input[type="submit"]:focus {
  border-color: #963730;
  background: #AD463E;
  color: #FFFFFF;
  box-shadow: 0 7px 16px rgba(150, 55, 48, 0.34);
}

.view_entry .booking-detail-page #view_entry_nav input[type="submit"]:disabled {
  border-color: #CBD5DF;
  background: #EEF2F5;
  color: #8796A3;
  box-shadow: none;
}

.view_entry .booking-detail-page #returl {
  margin: 0.75rem 1rem 0;
}

.view_entry .booking-detail-page #returl a {
  display: inline-flex;
  align-items: center;
  min-height: 1.75rem;
  box-sizing: border-box;
  padding: 0.2rem 0.75rem;
  border: 1px solid #CBD5DF;
  border-radius: 999px;
  background: #FFFFFF;
  color: #40566A;
  box-shadow: 0 4px 10px rgba(23, 50, 77, 0.12);
  font-size: 0.7rem;
  font-weight: 720;
  text-decoration: none;
}

.view_entry .booking-detail-page #returl a:hover,
.view_entry .booking-detail-page #returl a:focus {
  background: #EEF4F8;
  color: #17324D;
}

@media (max-width: 40rem) {
  .view_entry .booking-detail-page {
    width: calc(100% - 1rem);
    margin-top: 0.75rem;
  }

  .view_entry .booking-detail-header {
    padding: 0.85rem;
  }

  .view_entry .booking-detail-name {
    margin-left: 0 !important;
  }

  .view_entry .booking-detail-page #entry {
    width: calc(100% - 1.5rem);
    margin: 0.75rem;
  }

  .view_entry .booking-detail-page #entry td {
    padding: 0.55rem 0.6rem !important;
  }

  .view_entry .booking-detail-page #entry td:first-child {
    width: 42%;
  }

  .view_entry .booking-detail-page div#view_entry_nav {
    flex-wrap: wrap;
    padding-right: 0.75rem;
    padding-left: 0.75rem;
  }
}

/* Teinte pastel unique dans les informations de la réservation. */
.view_entry .booking-detail-page #entry tr {
  --detail-row-bg: #F8FCFF;
  --detail-label-bg: #EAF5FC;
  --detail-accent: #5B9FCE;
}

.view_entry .booking-detail-page #entry tr > td {
  background: var(--detail-row-bg);
}

.view_entry .booking-detail-page #entry tr > td:first-child {
  position: relative;
  padding-left: 0.95rem !important;
  background: var(--detail-label-bg);
  color: #3F5B72;
}

.view_entry .booking-detail-page #entry tr > td:first-child::before {
  content: "";
  position: absolute;
  top: 0.48rem;
  bottom: 0.48rem;
  left: 0;
  width: 3px;
  border-radius: 0 999px 999px 0;
  background: var(--detail-accent);
}

/* Priorité absolue : action destructive de la fiche utilisateur. */
html body .contents .user-edit-page form#form_edit_users input#delete_user_button {
  opacity: 1 !important;
  border: 1px solid #F0B8B8 !important;
  border-radius: 999px !important;
  background-color: #FFF5F5 !important;
  background-image: none !important;
  color: #991B1B !important;
  -webkit-text-fill-color: #991B1B !important;
  box-shadow: 0 5px 12px rgba(153, 27, 27, 0.24) !important;
  appearance: none !important;
}

html body .contents .user-edit-page form#form_edit_users input#delete_user_button:hover,
html body .contents .user-edit-page form#form_edit_users input#delete_user_button:focus {
  border-color: #E59A9A !important;
  background-color: #FDE8E8 !important;
  color: #7F1D1D !important;
  -webkit-text-fill-color: #7F1D1D !important;
  box-shadow: 0 7px 16px rgba(153, 27, 27, 0.3) !important;
}

/* ==========================================================================
 * Identité visuelle commune EspaceSt
 * Généralise les choix validés sur Ajouter une réservation et Quotas.
 * ========================================================================== */

form.standard {
  border-color: #D8E2EC !important;
  background: #F8FAFC !important;
  color: #17324D !important;
  box-shadow: 0 16px 38px rgba(23, 50, 77, 0.1) !important;
}

form.standard:is(
  #logon,
  #lost_password,
  #search_form,
  #import_form,
  #kiosk_enter,
  #kiosk_exit
),
form.standard.form_admin {
  float: none !important;
  width: min(46rem, calc(100% - 2rem)) !important;
  max-width: none !important;
  margin: 2rem auto 0 !important;
  padding: 1.4rem !important;
  box-sizing: border-box !important;
  border: 1px solid #D8E2EC !important;
  border-radius: 18px !important;
  background: #F8FAFC !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

form.standard:is(
  #edit_area,
  #edit_room,
  #form_edit_users,
  #report_form
) {
  float: none !important;
  width: min(46rem, calc(100% - 2rem)) !important;
  max-width: none !important;
  margin: 2rem auto 0 !important;
  padding: 1.4rem !important;
  box-sizing: border-box !important;
  border: 1px solid #D8E2EC !important;
  border-radius: 18px !important;
  background: #F8FAFC !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

form.standard:is(
  #logon,
  #lost_password,
  #search_form,
  #import_form,
  #kiosk_enter,
  #kiosk_exit,
  #edit_area,
  #edit_room,
  #form_edit_users,
  #report_form
) > fieldset,
form.standard.form_admin > fieldset {
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

form.standard:is(
  #logon,
  #lost_password,
  #search_form,
  #import_form,
  #kiosk_enter,
  #kiosk_exit,
  #edit_area,
  #edit_room,
  #form_edit_users,
  #report_form
) > fieldset > legend,
form.standard.form_admin > fieldset > legend {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.55rem !important;
  width: fit-content !important;
  max-width: 100% !important;
  margin: 0 0 0.9rem !important;
  padding: 0.4rem 0.7rem 0.4rem 0.45rem !important;
  box-sizing: border-box !important;
  border: 1px solid #D2E6EE !important;
  border-radius: 11px !important;
  background: linear-gradient(135deg, #EAF4FC 0%, #EDF8F3 100%) !important;
  color: #235F89 !important;
  box-shadow: 0 4px 12px rgba(47, 120, 173, 0.08) !important;
  font-size: 1.02rem !important;
  font-weight: 750 !important;
  letter-spacing: 0.005em !important;
  line-height: 1.3 !important;
}

form.standard:is(
  #logon,
  #lost_password,
  #search_form,
  #import_form,
  #kiosk_enter,
  #kiosk_exit,
  #edit_area,
  #edit_room,
  #form_edit_users,
  #report_form
) > fieldset > legend::before,
form.standard.form_admin > fieldset > legend::before {
  content: "";
  display: inline-block;
  width: 1.65rem;
  height: 1.65rem;
  flex: 0 0 auto;
  border: 1px solid #C9E0EC;
  border-radius: 8px;
  background-color: rgba(255, 255, 255, 0.82);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 4h14v16H5zM8 8h8M8 12h8M8 16h5' fill='none' stroke='%232F78AD' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1rem;
  box-shadow: 0 2px 6px rgba(47, 120, 173, 0.1);
}

form.standard:is(
  #edit_area,
  #edit_room,
  #form_edit_users,
  #report_form
) fieldset fieldset {
  margin: 0.75rem 0 !important;
  padding: 0.9rem !important;
  box-sizing: border-box !important;
  border: 1px solid #E0EAF1 !important;
  border-radius: 11px !important;
  background: rgba(255, 255, 255, 0.74) !important;
  box-shadow: 0 3px 10px rgba(23, 50, 77, 0.045) !important;
}

form.standard:is(
  #edit_area,
  #edit_room,
  #form_edit_users,
  #report_form
) fieldset fieldset > legend {
  width: fit-content !important;
  max-width: 100% !important;
  margin: 0 0 0.55rem !important;
  padding: 0.22rem 0.5rem !important;
  border: 1px solid #D9E8F0 !important;
  border-radius: 8px !important;
  background: linear-gradient(135deg, #F0F7FC 0%, #F2FAF6 100%) !important;
  color: #294862 !important;
  font-size: 0.78rem !important;
  font-style: normal !important;
  font-weight: 700 !important;
  letter-spacing: 0.005em !important;
  line-height: 1.35 !important;
}

form.standard label {
  color: #334E68 !important;
  font-size: 0.78rem !important;
  font-weight: 700 !important;
}

form.standard input[type="text"],
form.standard input[type="email"],
form.standard input[type="password"],
form.standard input[type="search"],
form.standard input[type="number"],
form.standard input[type="date"],
form.standard input[type="time"],
form.standard select,
form.standard textarea {
  border: 1px solid #BFCEDC !important;
  border-radius: 10px !important;
  background-color: #FDFEFF !important;
  color: #17324D !important;
  box-shadow: none !important;
}

form.standard input[type="text"]:focus,
form.standard input[type="email"]:focus,
form.standard input[type="password"]:focus,
form.standard input[type="search"]:focus,
form.standard input[type="number"]:focus,
form.standard input[type="date"]:focus,
form.standard input[type="time"]:focus,
form.standard select:focus,
form.standard textarea:focus {
  border-color: #3C8CCC !important;
  outline: 0 !important;
  box-shadow: 0 0 0 3px rgba(60, 140, 204, 0.16) !important;
}

form.standard .submit_buttons {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: wrap !important;
  gap: 0.6rem !important;
  width: 100% !important;
  margin: 0.9rem 0 0 !important;
  padding: 0.9rem 0.85rem 0 0 !important;
  box-sizing: border-box !important;
  border-top: 1px solid #DFE7EF !important;
}

form.standard input[type="submit"],
form.standard input[type="button"],
form.standard button {
  min-height: 1.75rem !important;
  border: 0 !important;
  border-radius: 20px !important;
  background-color: #F3F4F6 !important;
  color: #1F2937 !important;
  box-shadow: 0 7px 16px rgba(107, 114, 128, 0.3) !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
}

form.standard input[type="submit"]:hover,
form.standard input[type="submit"]:focus,
form.standard input[type="button"]:hover,
form.standard input[type="button"]:focus,
form.standard button:hover,
form.standard button:focus {
  background-color: #E5E7EB !important;
  color: #1F2937 !important;
  box-shadow: 0 9px 20px rgba(107, 114, 128, 0.4) !important;
}

.contents > .page-title,
.contents > h1.page-title,
.contents > h2.page-title {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
  width: fit-content !important;
  max-width: 100% !important;
  margin: 1.2rem 0 0.85rem !important;
  padding: 0.38rem 0.68rem !important;
  box-sizing: border-box !important;
  border: 1px solid #D2E6EE !important;
  border-left: 1px solid #D2E6EE !important;
  border-radius: 10px !important;
  background: linear-gradient(135deg, #EAF4FC 0%, #EDF8F3 100%) !important;
  color: #235F89 !important;
  box-shadow: 0 4px 12px rgba(47, 120, 173, 0.08) !important;
  font-size: 1rem !important;
  font-weight: 750 !important;
  line-height: 1.3 !important;
}

.contents > .page-title::before,
.contents > h1.page-title::before,
.contents > h2.page-title::before {
  content: "";
  display: inline-block;
  width: 1.45rem;
  height: 1.45rem;
  flex: 0 0 auto;
  border-radius: 7px;
  background-color: rgba(255, 255, 255, 0.82);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='8' r='3.2' fill='none' stroke='%232F78AD' stroke-width='1.8'/%3E%3Cpath d='M5 20c.7-3.7 3.1-5.7 7-5.7s6.3 2 7 5.7' fill='none' stroke='%232F78AD' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 0.9rem;
}

.user-edit-page {
  position: relative;
  width: min(46rem, calc(100% - 2rem));
  margin: 2rem auto 0;
  padding: 1.4rem;
  box-sizing: border-box;
  border: 1px solid #D8E2EC;
  border-radius: 18px;
  background: #F8FAFC;
  color: #17324D;
  box-shadow: 0 16px 38px rgba(23, 50, 77, 0.12);
}

.user-edit-page > .user-edit-title {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.55rem !important;
  width: fit-content !important;
  max-width: 100% !important;
  margin: 0 0 1rem !important;
  padding: 0.4rem 0.7rem 0.4rem 0.45rem !important;
  border: 1px solid #D2E6EE !important;
  border-radius: 11px !important;
  background: linear-gradient(135deg, #EAF4FC 0%, #EDF8F3 100%) !important;
  color: #235F89 !important;
  box-shadow: 0 4px 12px rgba(47, 120, 173, 0.08) !important;
  font-size: 1.02rem !important;
  font-weight: 750 !important;
  letter-spacing: 0.005em !important;
  line-height: 1.3 !important;
}

.user-edit-page > .user-edit-title::before {
  width: 1.65rem !important;
  height: 1.65rem !important;
  border: 1px solid #C9E0EC;
  border-radius: 8px;
  background-color: rgba(255, 255, 255, 0.82);
  background-size: 1rem !important;
  box-shadow: 0 2px 6px rgba(47, 120, 173, 0.1);
}

.user-edit-page form.standard#form_edit_users {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.user-edit-page form#form_edit_users > fieldset:not(:last-of-type) {
  float: none !important;
  width: 100% !important;
  margin: 0 0 0.75rem !important;
  padding: 0.9rem !important;
  box-sizing: border-box !important;
  border: 1px solid #E0EAF1 !important;
  border-radius: 11px !important;
  background: rgba(255, 255, 255, 0.76) !important;
  box-shadow: 0 3px 10px rgba(23, 50, 77, 0.045) !important;
}

.user-edit-page form#form_edit_users > fieldset:not(:last-of-type) > legend {
  width: fit-content !important;
  max-width: 100% !important;
  margin: 0 0 0.55rem !important;
  padding: 0.22rem 0.5rem !important;
  border: 1px solid #D9E8F0 !important;
  border-radius: 8px !important;
  background: linear-gradient(135deg, #F0F7FC 0%, #F2FAF6 100%) !important;
  color: #294862 !important;
  box-shadow: none !important;
  font-size: 0.78rem !important;
  font-style: normal !important;
  font-weight: 700 !important;
  line-height: 1.35 !important;
}

.user-edit-page form#form_edit_users > fieldset:last-of-type {
  float: none !important;
  width: 100% !important;
  margin: 0.9rem 0 0 !important;
  padding: 0.9rem 0 0 !important;
  border: 0 !important;
  border-top: 1px solid #DFE7EF !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.user-edit-page .user-delete-action-wrap {
  position: static !important;
  display: inline-flex !important;
  order: 2 !important;
  width: auto !important;
  height: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

.user-edit-page form#form_edit_users .submit_buttons > input.default_action {
  order: 1 !important;
}

.user-edit-page input.user-delete-action,
#form_edit_users input[name="delete_button"] {
  width: auto !important;
  min-width: 0 !important;
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  margin: 0 !important;
  padding: 0.2rem 0.75rem !important;
  border: 1px solid #F0B8B8 !important;
  border-radius: 999px !important;
  background: #FFF5F5 !important;
  color: #991B1B !important;
  box-shadow: 0 5px 12px rgba(153, 27, 27, 0.24) !important;
  font-size: 0.72rem !important;
  font-weight: 700 !important;
}

.user-edit-page input.user-delete-action:hover,
.user-edit-page input.user-delete-action:focus,
#form_edit_users input[name="delete_button"]:hover,
#form_edit_users input[name="delete_button"]:focus {
  border-color: #E59A9A !important;
  background: #FDE8E8 !important;
  color: #7F1D1D !important;
  box-shadow: 0 7px 16px rgba(153, 27, 27, 0.3) !important;
}

#form_edit_users input[name="update_button"] {
  border: 1px solid #2F78AD !important;
  background: #3C8CCC !important;
  color: #FFFFFF !important;
  box-shadow: 0 5px 12px rgba(47, 120, 173, 0.24) !important;
}

#form_edit_users input[name="update_button"]:hover,
#form_edit_users input[name="update_button"]:focus {
  border-color: #235F89 !important;
  background: #2F78AD !important;
  color: #FFFFFF !important;
  box-shadow: 0 7px 16px rgba(35, 95, 137, 0.3) !important;
}

.contents .datatable_container {
  overflow: hidden;
  border: 1px solid #D8E2EC !important;
  border-radius: 14px !important;
  background: #FFFFFF !important;
  box-shadow: 0 10px 26px rgba(23, 50, 77, 0.08) !important;
}

.contents table.admin_table thead th,
.contents table.admin_table thead td {
  border-color: #2B5878 !important;
  background: #234E6D !important;
  color: #FFFFFF !important;
  font-size: 0.76rem !important;
  font-weight: 700 !important;
}

.contents table.admin_table tbody tr:nth-child(even) {
  background: #F8FAFC !important;
}

.contents table.admin_table tbody tr:hover {
  background: #EEF7FB !important;
}

.contents table.admin_table tbody td {
  border-color: #E2EAF0 !important;
  color: #334E68 !important;
  font-size: 0.76rem !important;
}

.contents > p.error,
form.standard p.error,
form.standard ul.error {
  padding: 0.65rem 0.75rem !important;
  box-sizing: border-box !important;
  border: 1px solid #FDA4AF !important;
  border-left: 5px solid #E11D48 !important;
  border-radius: 9px !important;
  background: #FFF1F2 !important;
  color: #881337 !important;
}

@media (max-width: 44rem) {
  form.standard:is(
    #logon,
    #lost_password,
    #search_form,
    #import_form,
    #kiosk_enter,
    #kiosk_exit,
    #edit_area,
    #edit_room,
    #form_edit_users,
    #report_form
  ),
  form.standard.form_admin {
    width: calc(100% - 1.6rem) !important;
    max-width: none !important;
    margin-top: 0.8rem !important;
    padding: 0.8rem !important;
    border-radius: 12px !important;
  }

  form.standard .submit_buttons {
    justify-content: flex-start !important;
    padding-right: 0 !important;
  }

  .contents > .page-title,
  .contents > h1.page-title,
  .contents > h2.page-title {
    font-size: 0.94rem !important;
  }

  .user-edit-page {
    width: calc(100% - 1.6rem);
    margin-top: 0.8rem;
    padding: 0.8rem;
    border-radius: 12px;
  }

  .user-edit-page > .user-edit-title {
    font-size: 0.96rem !important;
  }

  .user-edit-page form.standard#form_edit_users {
    padding-top: 0 !important;
  }

  .user-edit-page .user-delete-action-wrap {
    position: static !important;
  }
}

@media (max-width: 22rem) {
  form.standard:is(
    #logon,
    #lost_password,
    #search_form,
    #import_form,
    #kiosk_enter,
    #kiosk_exit,
    #edit_area,
    #edit_room,
    #form_edit_users,
    #report_form
  ),
  form.standard.form_admin {
    width: calc(100% - 0.9rem) !important;
    max-width: none !important;
  }

  .user-edit-page {
    width: calc(100% - 0.9rem);
  }
}

/* Menu du compte : séparation claire entre espace personnel et administration. */
.banner nav.user-nav details.user-account-menu .user-account-submenu {
  min-width: 17rem !important;
  gap: 0.3rem !important;
}

.banner nav.user-nav details.user-account-menu .settings-submenu-section {
  width: 100%;
  box-sizing: border-box;
}

.banner nav.user-nav details.user-account-menu .settings-submenu-user-section {
  margin-top: 0 !important;
  border: 1px solid #CFE3F2;
  border-radius: 8px;
  background: #EFF7FC;
  color: #246E9F !important;
}

.banner nav.user-nav details.user-account-menu .settings-submenu-admin-section {
  margin-top: 0.45rem !important;
  padding-top: 0.55rem !important;
  border: 1px solid #D9D0F5;
  border-radius: 8px;
  background: #F3F0FF;
  color: #6246A8 !important;
}

.banner nav.user-nav details.user-account-menu .settings-submenu-user-section .settings-submenu-section-title::before {
  content: "";
  display: inline-block;
  width: 1em;
  height: 1em;
  margin-right: 0.4rem;
  vertical-align: -0.15em;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='8' r='3' fill='none' stroke='%23246E9F' stroke-width='2'/%3E%3Cpath fill='none' stroke='%23246E9F' stroke-width='2' d='M5 20c.7-3.4 3.1-5 7-5s6.3 1.6 7 5'/%3E%3C/svg%3E") center / contain no-repeat;
}

.banner nav.user-nav details.user-account-menu .settings-submenu-admin-section .settings-submenu-section-title::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%236246A8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M12 3 4 6v5c0 5 3.4 8.2 8 10 4.6-1.8 8-5 8-10V6zM9 12l2 2 4-4'/%3E%3C/svg%3E");
}

.banner nav.user-nav details.user-account-menu .settings-submenu-help::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='9' fill='none' stroke='%231F2937' stroke-width='1.8'/%3E%3Cpath d='M9.8 9a2.3 2.3 0 1 1 3.4 2c-.8.5-1.2 1-1.2 2M12 17h.01' fill='none' stroke='%231F2937' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");
}

.banner nav.user-nav details.user-account-menu .settings-submenu-admin-help::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3 4 6v5c0 5 3.4 8.2 8 10 4.6-1.8 8-5 8-10V6Z' fill='none' stroke='%238D342F' stroke-width='1.8' stroke-linejoin='round'/%3E%3Cpath d='M9.8 10a2.3 2.3 0 1 1 3.4 2c-.8.5-1.2 1-1.2 2m0 2.5h.01' fill='none' stroke='%238D342F' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");
}

.banner nav.user-nav a.public-guide-link {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  max-height: 1.75rem !important;
  box-sizing: border-box !important;
  padding: 2px 0.85rem 2px 2.15rem !important;
  border: 1px solid #C9DEEC !important;
  border-radius: 20px !important;
  background-color: #F1F8FC !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='9' fill='none' stroke='%232F78AD' stroke-width='1.8'/%3E%3Cpath d='M9.8 9a2.3 2.3 0 1 1 3.4 2c-.8.5-1.2 1-1.2 2M12 17h.01' fill='none' stroke='%232F78AD' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") !important;
  background-position: 0.65rem center !important;
  background-repeat: no-repeat !important;
  background-size: 1rem !important;
  color: #235F89 !important;
  font-size: 0.75rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  white-space: nowrap;
}

.banner nav.user-nav a.public-guide-link:hover,
.banner nav.user-nav a.public-guide-link:focus {
  border-color: #9FC4DC !important;
  background-color: #E2F0F8 !important;
  color: #1D5D86 !important;
}

.banner nav.user-nav a.public-guide-link,
.banner nav.user-nav form input.account-action,
.banner nav.user-nav form input[type="submit"] {
  font-family: inherit !important;
  font-size: 0.75rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  letter-spacing: normal !important;
  text-transform: none !important;
}

.banner nav.user-nav details.user-account-menu .settings-submenu-admin-section ~ .settings-submenu-link {
  border: 1px solid #F0CACA !important;
  background-color: #FFF3F2 !important;
  color: #8D342F !important;
}

.banner nav.user-nav details.user-account-menu .settings-submenu-admin-section ~ .settings-submenu-link:hover,
.banner nav.user-nav details.user-account-menu .settings-submenu-admin-section ~ .settings-submenu-link:focus {
  border-color: #E4AAA6 !important;
  background-color: #FDE4E2 !important;
  color: #742823 !important;
}

@media (max-width: 30rem) {
  .banner nav.user-nav details.user-account-menu .user-account-submenu {
    min-width: min(17rem, calc(100vw - 1rem)) !important;
  }
}

/* Rapport des réservations : même structure que la page Quotas utilisateurs. */
.settings-page.espacest-report-page {
  float: none !important;
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 auto !important;
  padding: 0 1rem 2rem !important;
  box-sizing: border-box !important;
}

.espacest-report-page .espacest-report-shell {
  width: 100%;
  max-width: none;
}

.espacest-report-page .report-pro-panel {
  width: min(100%, 46rem);
  margin: 2rem auto 0;
}

.espacest-report-page .report-pro-header .quota-pro-title-icon svg {
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.espacest-report-page form.standard#report_form {
  float: none !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.espacest-report-page #report_form > fieldset.report-pro-form-body {
  display: grid !important;
  grid-template-columns: minmax(0, 1.25fr) minmax(15rem, 0.75fr);
  align-items: start;
  gap: 0.85rem;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
}

.espacest-report-page #report_form fieldset.report-pro-card {
  float: none !important;
  min-width: 0 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 1rem !important;
  box-sizing: border-box !important;
  border: 1px solid #DCE6EF !important;
  border-radius: 14px !important;
  background: #FFFFFF !important;
  box-shadow: 0 6px 16px rgba(23, 50, 77, 0.06) !important;
}

.espacest-report-page #report_form fieldset.report-pro-card > legend {
  width: fit-content !important;
  max-width: 100% !important;
  margin: 0 0 0.8rem !important;
  padding: 0.28rem 0.55rem 0.28rem 2.35rem !important;
  box-sizing: border-box !important;
  border: 1px solid #D9E8F0 !important;
  border-radius: 9px !important;
  background-color: #F0F7FC !important;
  background-repeat: no-repeat !important;
  background-position: 0.55rem center !important;
  background-size: 1.2rem !important;
  color: #17324D !important;
  font-size: 0.84rem !important;
  font-weight: 700 !important;
  line-height: 1.4 !important;
}

.espacest-report-page #report_form fieldset.report-search-card > legend {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='10.5' cy='10.5' r='5.5' fill='none' stroke='%232F78AD' stroke-width='1.9'/%3E%3Cpath d='m15 15 5 5' fill='none' stroke='%232F78AD' stroke-width='1.9' stroke-linecap='round'/%3E%3C/svg%3E") !important;
}

.espacest-report-page #report_form fieldset.report-options-card > legend {
  background-color: #F2FAF6 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 7h10M18 7h2M4 17h2m4 0h10M14 4v6M7 14v6' fill='none' stroke='%2318746E' stroke-width='1.9' stroke-linecap='round'/%3E%3C/svg%3E") !important;
}

.espacest-report-page #report_form fieldset.report-pro-card > div {
  display: grid !important;
  grid-template-columns: minmax(7.5rem, 0.85fr) minmax(0, 1.15fr);
  align-items: center !important;
  gap: 0.35rem 0.7rem !important;
  min-width: 0 !important;
  width: 100% !important;
  margin: 0 0 0.58rem !important;
  padding: 0 !important;
  box-sizing: border-box !important;
}

.espacest-report-page #report_form fieldset.report-pro-card > div:last-child {
  margin-bottom: 0 !important;
}

.espacest-report-page #report_form fieldset.report-pro-card > div > label {
  float: none !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #52667A !important;
  font-size: 0.74rem !important;
  font-weight: 700 !important;
  line-height: 1.35;
  text-align: left !important;
}

.espacest-report-page #report_form fieldset.report-pro-card input[type="text"],
.espacest-report-page #report_form fieldset.report-pro-card input[type="date"],
.espacest-report-page #report_form fieldset.report-pro-card select {
  float: none !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 2.3rem !important;
  margin: 0 !important;
  padding: 0.42rem 0.6rem !important;
  box-sizing: border-box !important;
  border: 1px solid #BFCEDC !important;
  border-radius: 10px !important;
  background: #FDFEFF !important;
  color: #17324D !important;
  font-size: 0.82rem !important;
}

.espacest-report-page #report_form fieldset.report-pro-card .group {
  display: flex !important;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.35rem 0.7rem;
  min-width: 0;
}

.espacest-report-page #report_form fieldset.report-pro-card .group label {
  display: inline-flex !important;
  align-items: center;
  gap: 0.3rem;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  color: #52667A !important;
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  white-space: nowrap;
}

.espacest-report-page #report_form fieldset.report-pro-card input[type="radio"] {
  margin: 0 !important;
  accent-color: #3C8CCC;
}

.espacest-report-page #report_form fieldset.report-pro-actions {
  grid-column: 1 / -1;
  display: flex !important;
  align-items: center;
  justify-content: flex-end;
  gap: 0.55rem;
  width: 100% !important;
  margin: 0 !important;
  padding: 0.9rem 0 0 !important;
  border: 0 !important;
  border-top: 1px solid #DFE7EF !important;
  background: transparent !important;
}

.espacest-report-page #report_form fieldset.report-pro-actions > div {
  display: block !important;
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
}

.espacest-report-page #report_form fieldset.report-pro-actions > div > label {
  display: none !important;
}

.espacest-report-page .report-results-card {
  margin: 1rem 0 0;
}

@media (max-width: 44rem) {
  .settings-page.espacest-report-page {
    padding: 0 !important;
  }

  .espacest-report-page .report-pro-panel {
    width: 100%;
    margin-top: 0.75rem;
    padding: 0.8rem;
    border-radius: 12px;
  }

  .espacest-report-page #report_form > fieldset.report-pro-form-body {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.65rem;
  }

  .espacest-report-page #report_form fieldset.report-pro-card {
    padding: 0.75rem !important;
  }

  .espacest-report-page #report_form fieldset.report-pro-card > div {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.28rem !important;
    margin-bottom: 0.65rem !important;
  }

  .espacest-report-page #report_form fieldset.report-pro-card input[type="text"],
  .espacest-report-page #report_form fieldset.report-pro-card input[type="date"],
  .espacest-report-page #report_form fieldset.report-pro-card select {
    width: 100% !important;
    min-height: 2.5rem !important;
    font-size: 1rem !important;
  }

}

/* Rapport : résultats alignés sur les cartes et la palette EspaceSt. */
.report-results-card {
  clear: both;
  width: 100%;
  box-sizing: border-box;
  margin: 1.25rem 0;
  border: 1px solid #D7E5F1;
  border-radius: 14px;
  background: #FFFFFF;
  box-shadow: 0 8px 24px rgba(23, 50, 77, 0.10);
  overflow: hidden;
}

.report-results-header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.9rem 1rem;
  border-bottom: 1px solid #D7E5F1;
  background: linear-gradient(135deg, #EAF4FC 0%, #EDF8F3 100%);
  color: #17324D;
}

.report-results-icon {
  display: inline-flex;
  flex: 0 0 2.35rem;
  align-items: center;
  justify-content: center;
  width: 2.35rem;
  height: 2.35rem;
  border-radius: 10px;
  background: #FFFFFF;
  color: #3C8CCC;
  box-shadow: 0 3px 10px rgba(60, 140, 204, 0.16);
}

.report-results-icon svg {
  width: 1.35rem;
  height: 1.35rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.report-results-heading {
  min-width: 0;
}

.report-results-eyebrow {
  display: block;
  margin-bottom: 0.12rem;
  color: #61778B;
  font-size: 0.68rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  line-height: 1.2;
  text-transform: uppercase;
}

.report-results-header h2 {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
  color: #17324D;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1.3;
}

.report-results-count {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  min-width: 1.7rem;
  min-height: 1.7rem;
  box-sizing: border-box;
  padding: 0.15rem 0.42rem;
  border-radius: 999px;
  background: #3C8CCC;
  color: #FFFFFF;
  font-size: 0.75rem;
  line-height: 1;
}

.report-results-card #report_output {
  width: 100%;
  box-sizing: border-box;
  padding: 0.85rem 1rem 1rem;
  overflow-x: auto;
}

.report-results-card #report_table,
.report-results-card #report_table.dataTable,
.report-results-card #report_output table.dataTable {
  width: 100% !important;
  border: 1px solid #D7E5F1 !important;
  border-radius: 10px;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  color: #17324D;
  overflow: hidden;
}

.report-results-card #report_table thead th,
.report-results-card #report_output table.dataTable thead th {
  padding: 0.65rem 1.6rem 0.65rem 0.7rem !important;
  border-color: #C8DCEB !important;
  background-color: #EAF4FC !important;
  color: #17324D !important;
  font-size: 0.75rem;
  font-weight: 700;
  white-space: nowrap;
}

.report-results-card #report_table tbody td,
.report-results-card #report_output table.dataTable tbody td {
  padding: 0.58rem 0.7rem !important;
  border-top: 1px solid #E3EDF5 !important;
  border-right: 0 !important;
  border-bottom: 0 !important;
  background: #FFFFFF !important;
  color: #294862;
  font-size: 0.78rem;
  line-height: 1.35;
  vertical-align: middle;
}

.report-results-card #report_table tbody tr:nth-child(even) td,
.report-results-card #report_output table.dataTable tbody tr:nth-child(even) td {
  background: #F8FBFD !important;
}

.report-results-card #report_table tbody tr:hover td,
.report-results-card #report_output table.dataTable tbody tr:hover td {
  background: #F0F8FC !important;
}

.report-results-card #report_output .dataTables_length,
.report-results-card #report_output .dataTables_filter,
.report-results-card #report_output .dataTables_info,
.report-results-card #report_output .dataTables_paginate {
  color: #536579;
  font-size: 0.75rem;
}

.report-results-card #report_output .dataTables_length select,
.report-results-card #report_output .dataTables_filter input {
  min-height: 1.9rem;
  box-sizing: border-box;
  border: 1px solid #AAB8C7;
  border-radius: 8px;
  background: #FFFFFF;
  color: #17324D;
}

.report-results-card #report_output .dataTables_filter input:focus {
  border-color: #3C8CCC;
  outline: 2px solid rgba(60, 140, 204, 0.18);
  outline-offset: 1px;
}

.report-results-card #div_summary {
  padding: 1rem;
  overflow-x: auto;
}

.report-results-empty .report-results-header {
  border-bottom: 0;
}

@media (max-width: 44rem) {
  .report-results-card {
    margin: 0.9rem 0;
    border-radius: 12px;
  }

  .report-results-header {
    padding: 0.75rem;
  }

  .report-results-card #report_output {
    padding: 0.7rem;
  }

  .report-results-card #report_table {
    min-width: 48rem;
  }

  .report-results-card #report_output .dataTables_length,
  .report-results-card #report_output .dataTables_filter {
    float: none;
    width: 100%;
    margin: 0 0 0.55rem;
    text-align: left;
  }

  .report-results-card #report_output .dataTables_filter input {
    width: min(100%, 18rem);
  }
}

/* Ajouter une réservation — titres compacts assortis à la page des quotas. */
.edit_entry form.standard#main {
  float: none !important;
  width: min(100%, 46rem) !important;
  max-width: calc(100% - 2rem) !important;
  margin: 2rem auto 0 !important;
  padding: 1.4rem !important;
  box-sizing: border-box !important;
  border: 1px solid #D8E2EC !important;
  border-radius: 18px !important;
  background: #F8FAFC !important;
  color: #17324D !important;
  box-shadow: 0 16px 38px rgba(23, 50, 77, 0.12) !important;
}

.edit_entry form.standard#main > fieldset:first-of-type > legend {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.55rem !important;
  width: fit-content !important;
  margin: 0.55rem 0 0.75rem !important;
  padding: 0.4rem 0.7rem 0.4rem 0.45rem !important;
  box-sizing: border-box !important;
  border: 1px solid #D2E6EE !important;
  border-radius: 11px !important;
  background: linear-gradient(135deg, #EAF4FC 0%, #EDF8F3 100%) !important;
  color: #235F89 !important;
  box-shadow: 0 4px 12px rgba(47, 120, 173, 0.08) !important;
  font-size: 1.02rem !important;
  font-weight: 750 !important;
  letter-spacing: 0.005em !important;
  line-height: 1.3 !important;
}

.edit_entry form.standard#main > fieldset:first-of-type > legend::before {
  content: "";
  display: inline-block;
  width: 1.65rem;
  height: 1.65rem;
  flex: 0 0 auto;
  border: 1px solid #C9E0EC;
  border-radius: 8px;
  background-color: rgba(255, 255, 255, 0.82);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3.5' y='5' width='17' height='15.5' rx='2.5' fill='none' stroke='%232F78AD' stroke-width='1.8'/%3E%3Cpath d='M8 3v4M16 3v4M3.5 9.5h17M12 12v6M9 15h6' fill='none' stroke='%232F78AD' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1.05rem;
  box-shadow: 0 2px 6px rgba(47, 120, 173, 0.1);
}

.edit_entry form.standard#main > fieldset:first-of-type > div > label {
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.4rem !important;
  width: fit-content !important;
  margin: 0.12rem 0.7rem 0.12rem 0 !important;
  padding: 0.25rem 0.5rem !important;
  box-sizing: border-box !important;
  border: 1px solid #D9E8F0 !important;
  border-radius: 8px !important;
  background: linear-gradient(135deg, #F0F7FC 0%, #F2FAF6 100%) !important;
  color: #294862 !important;
  font-size: 0.76rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.005em !important;
  line-height: 1.35 !important;
  text-align: left !important;
}

.edit_entry form.standard#main > fieldset:first-of-type > div > label::before {
  content: "";
  display: inline-block;
  width: 0.95rem;
  height: 0.95rem;
  flex: 0 0 auto;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 6h14M5 12h14M5 18h9' fill='none' stroke='%232F78AD' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
}

.edit_entry form.standard#main label[for="name"]::before,
.edit_entry form.standard#main label[for="create_by"]::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='8' r='3.5' fill='none' stroke='%232F78AD' stroke-width='1.9'/%3E%3Cpath d='M5 20v-1.5c0-3 3.1-5.5 7-5.5s7 2.5 7 5.5V20' fill='none' stroke='%232F78AD' stroke-width='1.9' stroke-linecap='round'/%3E%3C/svg%3E");
}

.edit_entry form.standard#main label[for="description"]::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 5h14v14H5zM8 9h8M8 13h8M8 17h5' fill='none' stroke='%232F78AD' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.edit_entry form.standard#main label[for="start_date"]::before,
.edit_entry form.standard#main label[for="end_date"]::before,
.edit_entry form.standard#main .start_end > label::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3.5' y='5' width='17' height='15.5' rx='2.5' fill='none' stroke='%2318746E' stroke-width='1.8'/%3E%3Cpath d='M8 3v4M16 3v4M3.5 9.5h17M8 14h3M13 14h3M8 17h3' fill='none' stroke='%2318746E' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");
}

.edit_entry form.standard#main label[for="rooms"]::before,
.edit_entry form.standard#main label[for="area"]::before,
.edit_entry form.standard#main #div_rooms > label::before,
.edit_entry form.standard#main #div_areas > label::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 21V5h16v16M4 9h16M8 13h2M14 13h2M8 17h2M14 17h2' fill='none' stroke='%2318746E' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.edit_entry form.standard#main .start_end > div {
  display: flex !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 0.5rem !important;
  width: fit-content !important;
  max-width: 100% !important;
}

.edit_entry form.standard#main .start_end > div > *:not(.none) {
  float: none !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
}

.edit_entry form.standard#main .start_end input[type="date"],
.edit_entry form.standard#main .start_end input.date,
.edit_entry form.standard#main .start_end input.form-control.input {
  width: 9.5rem !important;
  max-width: 100% !important;
}

.edit_entry form.standard#main .start_end select {
  width: auto !important;
  min-width: 6.5rem !important;
  max-width: 100% !important;
}

.edit_entry form.standard#main select[name="create_by"],
.edit_entry form.standard#main input[name="create_by"] {
  width: 15rem !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin-right: 0 !important;
}

.edit_entry form.standard#main .field-create-by,
.edit_entry form.standard#main .field-create-by > div {
  text-align: left !important;
}

.edit_entry form.standard#main .field-create-by {
  display: block !important;
  width: 100% !important;
}

.edit_entry form.standard#main .field-create-by > label {
  display: inline-flex !important;
  width: fit-content !important;
  margin: 0.12rem 0 0.4rem !important;
}

.edit_entry form.standard#main .field-create-by > div {
  display: block !important;
  clear: both !important;
  width: 15rem !important;
  max-width: 100% !important;
}

.edit_entry form.standard#main .field-create-by > select[name="create_by"],
.edit_entry form.standard#main .field-create-by > input[name="create_by"] {
  display: block !important;
  clear: both !important;
}

.edit_entry form.standard#main .field-create-by .select2-container {
  display: inline-block !important;
  float: left !important;
  width: 15rem !important;
  max-width: 100% !important;
  margin: 0 !important;
}

.edit_entry form.standard#main .field-booking-title {
  display: block !important;
  width: 100% !important;
  text-align: left !important;
}

.edit_entry form.standard#main .field-booking-title > label {
  display: inline-flex !important;
  width: fit-content !important;
  margin: 0.12rem 0 0.4rem !important;
}

.edit_entry form.standard#main .field-booking-title input[name="name"] {
  display: block !important;
  clear: both !important;
  width: 17rem !important;
  max-width: 100% !important;
  margin-right: 0 !important;
}

/* Nouvelle composition du formulaire : deux colonnes équilibrées sur écran
 * large et une seule colonne sur mobile. */
.edit_entry form.standard#main > fieldset:first-of-type {
  float: none !important;
  display: grid !important;
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0.85rem 1rem !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 1rem !important;
  box-sizing: border-box !important;
}

.edit_entry form.standard#main > fieldset:first-of-type > legend {
  grid-column: 1 / -1 !important;
}

.edit_entry form.standard#main > fieldset:first-of-type > div {
  float: none !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  min-width: 0 !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0.75rem !important;
  box-sizing: border-box !important;
  border: 1px solid #E0EAF1 !important;
  border-radius: 11px !important;
  background: rgba(255, 255, 255, 0.72) !important;
  box-shadow: 0 3px 10px rgba(23, 50, 77, 0.045) !important;
  text-align: left !important;
}

.edit_entry form.standard#main > fieldset:first-of-type > div > label {
  flex: 0 0 auto !important;
  margin: 0 0 0.5rem !important;
}

.edit_entry form.standard#main .field-booking-description,
.edit_entry form.standard#main #div_areas,
.edit_entry form.standard#main #div_rooms {
  grid-column: 1 / -1 !important;
}

.edit_entry form.standard#main .field-booking-description textarea {
  display: block !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
}

.edit_entry form.standard#main .field-booking-start {
  grid-column: 1 !important;
}

.edit_entry form.standard#main .field-booking-end {
  grid-column: 2 !important;
}

.edit_entry form.standard#main #div_rooms > select,
.edit_entry form.standard#main #div_areas > select {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
}

.edit_entry form.standard#main #div_rooms {
  display: none !important;
}

.edit_entry form.standard#main > fieldset:last-of-type {
  float: none !important;
  display: block !important;
  width: 100% !important;
  margin: 0.9rem 0 0 !important;
  padding: 0.9rem 0 0 !important;
  box-sizing: border-box !important;
  border: 0 !important;
  border-top: 1px solid #DFE7EF !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.edit_entry form.standard#main > fieldset:last-of-type .submit_buttons {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: nowrap !important;
  gap: 0.6rem !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 0.85rem 0 0 !important;
}

.edit_entry form.standard#main > fieldset:last-of-type .submit_buttons > label {
  order: 1 !important;
  flex: 0 0 auto !important;
  width: auto !important;
  height: 1.75rem !important;
  margin: 0 !important;
}

.edit_entry form.standard#main > fieldset:last-of-type .submit_buttons > div {
  display: contents !important;
}

.edit_entry form.standard#main > fieldset:last-of-type .submit_buttons > div > input[type="submit"] {
  order: 2 !important;
  flex: 0 0 auto !important;
  width: auto !important;
  height: 1.75rem !important;
  margin: 0 !important;
}

.edit_entry form.standard#main > fieldset:last-of-type .submit_buttons #checks {
  order: 3 !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 0.3rem !important;
  flex: 0 0 auto !important;
  width: auto !important;
  min-height: 1.75rem !important;
  margin: 0 0 0 0.25rem !important;
  text-align: left !important;
}

@media (max-width: 44rem) {
  .edit_entry form.standard#main {
    width: 100% !important;
    max-width: calc(100% - 1.6rem) !important;
    margin-top: 0.8rem !important;
    padding: 0.8rem !important;
    border-radius: 12px !important;
  }

  .edit_entry form.standard#main > fieldset:first-of-type > legend {
    font-size: 0.96rem !important;
  }

  .edit_entry form.standard#main > fieldset:first-of-type {
    grid-template-columns: minmax(0, 1fr) !important;
    gap: 0.65rem !important;
    padding: 0.75rem !important;
  }

  .edit_entry form.standard#main .field-booking-start,
  .edit_entry form.standard#main .field-booking-end {
    grid-column: 1 !important;
  }

  .edit_entry form.standard#main > fieldset:last-of-type .submit_buttons {
    justify-content: flex-start !important;
    padding-right: 0 !important;
  }
}

@media (max-width: 22rem) {
  .edit_entry form.standard#main {
    max-width: calc(100% - 0.9rem) !important;
  }
}

/* Page d'alerte des conflits — même gabarit que Quotas utilisateurs. */
.booking-conflict-page {
  width: min(100%, 46rem);
  max-width: calc(100% - 2rem);
  margin: 2rem auto 0;
  padding: 1.4rem;
  box-sizing: border-box;
  border: 1px solid #DCE6EE;
  border-radius: 18px;
  background: #FFFDFB;
  color: #17324D;
  box-shadow: 0 18px 42px rgba(23, 50, 77, 0.11);
}

.booking-conflict-page .booking-conflict-message {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #17324D !important;
  box-shadow: none !important;
  font-size: 0.8rem !important;
}

.booking-conflict-page .booking-conflict-message h2 {
  display: inline-flex;
  align-items: center;
  gap: 0.55rem;
  width: 100%;
  margin: 0 0 0.8rem !important;
  padding: 0.58rem 0.8rem;
  box-sizing: border-box;
  border: 1px solid #8F1D1D;
  border-left: 5px solid #F59E0B;
  border-radius: 12px;
  background: linear-gradient(135deg, #8F1D1D 0%, #B91C1C 100%);
  color: #FFFFFF !important;
  box-shadow: 0 8px 18px rgba(127, 29, 29, 0.2);
  font-size: 1.02rem !important;
  font-weight: 750;
  letter-spacing: 0.005em;
  line-height: 1.3;
}

.booking-conflict-page .booking-conflict-message h2::before {
  content: "";
  display: inline-block;
  width: 1.65rem;
  height: 1.65rem;
  flex: 0 0 auto;
  border: 1px solid rgba(255, 255, 255, 0.32);
  border-radius: 8px;
  background-color: rgba(255, 255, 255, 0.12);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3.5 21 20H3L12 3.5Z' fill='none' stroke='%23FFFFFF' stroke-width='1.8' stroke-linejoin='round'/%3E%3Cpath d='M12 9v5M12 17.2v.2' fill='none' stroke='%23FFFFFF' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");
  background-position: center;
  background-repeat: no-repeat;
  background-size: 1.05rem;
  box-shadow: none;
}

.booking-conflict-page .booking-conflict-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.75rem;
  height: 1.75rem;
  margin-left: auto;
  padding: 0 0.42rem;
  box-sizing: border-box;
  border-radius: 999px;
  background: #F97316;
  color: #FFFFFF;
  font-size: 0.7rem;
  font-weight: 800;
  line-height: 1;
}

.booking-conflict-page .booking-alert-intro {
  margin: 0 0 0.75rem !important;
  padding: 0.55rem 0.75rem !important;
  border: 1px solid #FDA4AF;
  border-left: 5px solid #E11D48;
  border-radius: 0 8px 8px 0;
  background: #FFF1F2;
  color: #881337 !important;
  font-size: 0.78rem !important;
  line-height: 1.5;
}

.booking-conflict-page .booking-alert-intro strong {
  display: inline-block;
  margin-right: 0.35rem;
  padding: 0.12rem 0.38rem;
  border-radius: 6px;
  background: #E11D48;
  color: #FFFFFF;
  font-size: 0.7rem;
  letter-spacing: 0.025em;
  text-transform: uppercase;
}

.booking-conflict-page .booking-alert-list {
  display: grid;
  gap: 0.6rem;
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.booking-conflict-page .booking-conflict-list {
  counter-reset: booking-conflict;
}

.booking-conflict-page .booking-alert-item {
  position: relative;
  margin: 0 !important;
  padding: 0.85rem 0.9rem 0.8rem 3.15rem !important;
  box-sizing: border-box;
  border: 1px solid #EFCACA;
  border-left: 4px solid #DC2626;
  border-radius: 12px !important;
  background: linear-gradient(135deg, #FFFFFF 0%, #FFF7F7 100%) !important;
  color: #52667A !important;
  box-shadow: 0 5px 14px rgba(23, 50, 77, 0.055);
  font-size: 0.78rem !important;
  font-weight: 400 !important;
  line-height: 1.5;
}

.booking-conflict-page .booking-conflict-item::before {
  content: counter(booking-conflict, decimal-leading-zero);
  counter-increment: booking-conflict;
  position: absolute;
  top: 0.85rem;
  left: 0.8rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.65rem;
  height: 1.65rem;
  border: 1px solid #FDA4AF;
  border-radius: 7px;
  background: #FFE4E6;
  color: #9F1239;
  font-size: 0.62rem;
  font-weight: 800;
  letter-spacing: 0.02em;
}

.booking-conflict-page .booking-rule-item {
  padding-left: 0.9rem !important;
}

.booking-conflict-page .booking-conflict-item > a:first-child {
  display: block;
  width: fit-content;
  margin-bottom: 0.25rem;
  color: #17324D !important;
  font-size: 0.86rem;
  font-weight: 750;
  text-decoration: none;
}

.booking-conflict-page .booking-conflict-item > a:first-child:hover,
.booking-conflict-page .booking-conflict-item > a:first-child:focus {
  color: #2F78AD !important;
  text-decoration: underline;
}

.booking-conflict-page .booking-conflict-item > span {
  display: block;
  margin-top: 0.45rem;
  color: transparent;
  font-size: 0;
}

.booking-conflict-page .booking-conflict-item > span a {
  display: inline-flex;
  align-items: center;
  min-height: 1.55rem;
  padding: 0.18rem 0.55rem;
  gap: 0.25rem;
  border: 1px solid #C8DCE8;
  border-radius: 999px;
  background: #F4F9FC;
  color: #2F78AD !important;
  font-size: 0.7rem;
  font-weight: 700;
  text-decoration: none;
}

.booking-conflict-page .booking-conflict-item > span a::after {
  content: "→";
  font-size: 0.82rem;
  line-height: 1;
}

.booking-conflict-page .booking-conflict-item > span a:hover,
.booking-conflict-page .booking-conflict-item > span a:focus {
  background: #DFEDF5;
  color: #235F89 !important;
}

.booking-conflict-page #submit_buttons {
  width: 100%;
  margin-top: 0.9rem;
  padding-top: 0.9rem;
  box-sizing: border-box;
  border-top: 1px solid #DFE7EF;
}

.booking-conflict-page #submit_buttons form {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 0.6rem;
  margin: 0;
}

/* Même lisibilité dans le détail de conflit affiché avant validation. */
.edit_entry form#main #schedule_details.has-conflict {
  border-left-color: #E11D48 !important;
  background: #FFF1F2 !important;
  color: #881337 !important;
}

.edit_entry form#main #schedule_details.has-conflict ul {
  display: grid !important;
  gap: 0.55rem !important;
  margin: 0.65rem 0 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

.edit_entry form#main #schedule_details.has-conflict li {
  margin: 0 !important;
  padding: 0.7rem 0.8rem !important;
  border: 1px solid #E2EAF0 !important;
  border-radius: 10px !important;
  background: #FFFFFF !important;
  color: #52667A !important;
  font-size: 0.76rem !important;
  font-weight: 400 !important;
  line-height: 1.45 !important;
}

.edit_entry form#main #schedule_details.has-conflict li > a:first-child {
  display: block;
  margin-bottom: 0.2rem;
  color: #235F89 !important;
  font-size: 0.82rem;
  font-weight: 750;
}

@media (max-width: 44rem) {
  .booking-conflict-page {
    width: 100%;
    max-width: calc(100% - 1.6rem);
    margin-top: 0.8rem;
    padding: 0.8rem;
    border-radius: 12px;
  }

  .booking-conflict-page .booking-conflict-message h2 {
    font-size: 0.96rem !important;
  }

  .booking-conflict-page #submit_buttons form {
    justify-content: flex-start;
  }
}

/* Page Quotas utilisateurs — interface professionnelle unifiée. */
.settings-page.espacest-quota-page {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 1rem 2rem !important;
  box-sizing: border-box !important;
}

.settings-page.espacest-quota-page .espacest-quota-shell {
  width: 100% !important;
  max-width: none !important;
}

.quota-pro-panel {
  width: min(100%, 46rem);
  margin: 2rem auto 0;
  padding: 1.4rem;
  box-sizing: border-box;
  border: 1px solid #D8E2EC;
  border-radius: 18px;
  background: #F8FAFC;
  color: #17324D;
  box-shadow: 0 16px 38px rgba(23, 50, 77, 0.12);
}

.quota-pro-header {
  margin-bottom: 1.15rem;
  padding: 0 0.2rem 1rem;
  border-bottom: 1px solid #DFE7EF;
}

.quota-pro-kicker {
  display: block;
  margin-bottom: 0.25rem;
  color: #397FB3;
  font-size: 0.7rem;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.quota-pro-header h1 {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  margin: 0;
  width: fit-content;
  padding: 0.4rem 0.7rem 0.4rem 0.45rem;
  border: 1px solid #D2E6EE;
  border-radius: 11px;
  background: linear-gradient(135deg, #EAF4FC 0%, #EDF8F3 100%);
  color: #235F89;
  font-size: 1.02rem;
  font-weight: 750;
  letter-spacing: 0.005em;
  line-height: 1.3;
  box-shadow: 0 4px 12px rgba(47, 120, 173, 0.08);
}

.quota-pro-title-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.65rem;
  height: 1.65rem;
  flex: 0 0 auto;
  border: 1px solid #C9E0EC;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.82);
  color: #2F78AD;
  box-shadow: 0 2px 6px rgba(47, 120, 173, 0.1);
}

.quota-pro-title-icon svg {
  width: 1.05rem;
  height: 1.05rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.quota-pro-header p {
  max-width: 42rem;
  margin: 0.4rem 0 0;
  color: #64748B;
  font-size: 0.86rem;
  line-height: 1.5;
}

.quota-pro-settings-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.85rem;
}

.quota-pro-card {
  min-width: 0;
  padding: 1rem;
  box-sizing: border-box;
  border: 1px solid #DCE6EF;
  border-radius: 14px;
  background: #FFFFFF;
  box-shadow: 0 6px 16px rgba(23, 50, 77, 0.06);
}

.quota-pro-card-heading {
  display: grid;
  grid-template-columns: 1.8rem minmax(0, 1fr);
  align-items: start;
  gap: 0.7rem;
}

.quota-pro-step {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.8rem;
  height: 1.8rem;
  border-radius: 9px;
  background: #E7F2FA;
  color: #2F78AD;
  font-size: 0.7rem;
  font-weight: 800;
}

.quota-pro-step svg {
  width: 1rem;
  height: 1rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.quota-pro-step-system {
  background: #E7F2FA;
  color: #2F78AD;
}

.quota-pro-step-user {
  background: #E6F5EF;
  color: #18746E;
}

.quota-pro-card-heading h2 {
  margin: 0;
  width: fit-content;
  padding: 0.22rem 0.5rem;
  border: 1px solid #D9E8F0;
  border-radius: 8px;
  background: linear-gradient(135deg, #F0F7FC 0%, #F2FAF6 100%);
  color: #17324D;
  font-size: 0.84rem;
  font-weight: 700;
  letter-spacing: 0.005em;
  line-height: 1.35;
}

.quota-pro-card-heading p {
  margin: 0.35rem 0 0;
  padding-left: 0.45rem;
  border-left: 2px solid #C8DEE9;
  color: #64748B;
  font-size: 0.75rem;
  line-height: 1.4;
}

.quota-pro-save-form,
.quota-pro-user-selector {
  margin: 0.9rem 0 0;
}

.quota-user-search-copy {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
  margin-bottom: 0.45rem;
}

.quota-user-search-copy strong {
  color: #17324D;
  font-size: 0.78rem;
}

.quota-user-search-copy span {
  color: #698094;
  font-size: 0.67rem;
  line-height: 1.4;
}

.quota-user-search-control {
  position: relative;
}

.quota-user-search-field {
  position: relative;
  display: flex;
  align-items: center;
}

.quota-user-search-field svg {
  position: absolute;
  left: 0.75rem;
  width: 1rem;
  height: 1rem;
  fill: none;
  stroke: #668196;
  stroke-width: 1.8;
  stroke-linecap: round;
  pointer-events: none;
}

.quota-user-search-field input {
  width: 100%;
  height: 2.4rem;
  box-sizing: border-box;
  margin: 0;
  padding: 0.45rem 2.5rem 0.45rem 2.25rem;
  border: 1px solid #C8D8E4;
  border-radius: 10px;
  background: #FFFFFF;
  color: #17324D;
  font-size: 0.75rem;
  outline: none;
}

.quota-user-search-field input:focus {
  border-color: #4B93C5;
  box-shadow: 0 0 0 3px rgba(75, 147, 197, 0.15);
}

.quota-user-search-clear {
  position: absolute;
  top: 50%;
  right: 0.45rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.55rem;
  height: 1.55rem;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #E8F0F5;
  color: #48677D;
  box-shadow: none;
  font-size: 1rem;
  line-height: 1;
  transform: translateY(-50%);
  cursor: pointer;
}

.quota-user-search-clear[hidden] {
  display: none !important;
}

.quota-user-search-clear:hover,
.quota-user-search-clear:focus {
  background: #D7E7F1;
  color: #17324D;
  box-shadow: none;
  transform: translateY(-50%);
}

.quota-user-search-feedback {
  min-height: 1rem;
  margin: 0.3rem 0 0.55rem;
  color: #698094;
  font-size: 0.66rem;
  font-weight: 650;
}

.quota-pro-switch {
  display: inline-flex;
  align-items: center;
  gap: 0.65rem;
  color: #334E68;
  font-size: 0.82rem;
  font-weight: 700;
  cursor: pointer;
}

.quota-pro-switch input {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
}

.quota-pro-switch-track {
  position: relative;
  width: 2.65rem;
  height: 1.45rem;
  flex: 0 0 auto;
  border-radius: 999px;
  background: #CBD5E1;
  box-shadow: inset 0 1px 2px rgba(23, 50, 77, 0.12);
  transition: background-color 160ms ease;
}

.quota-pro-switch-track::after {
  content: "";
  position: absolute;
  top: 0.2rem;
  left: 0.2rem;
  width: 1.05rem;
  height: 1.05rem;
  border-radius: 50%;
  background: #FFFFFF;
  box-shadow: 0 2px 5px rgba(23, 50, 77, 0.25);
  transition: transform 160ms ease;
}

.quota-pro-switch input:checked + .quota-pro-switch-track {
  background: #3C8CCC;
}

.quota-pro-switch input:checked + .quota-pro-switch-track::after {
  transform: translateX(1.2rem);
}

.quota-pro-switch input:focus-visible + .quota-pro-switch-track {
  outline: 3px solid rgba(60, 140, 204, 0.22);
  outline-offset: 2px;
}

.quota-pro-user-selector > label {
  display: block;
  margin-bottom: 0.35rem;
  color: #52667A;
  font-size: 0.72rem;
  font-weight: 700;
}

.quota-pro-select-wrap {
  position: relative;
}

.quota-pro-select-wrap select {
  width: 100%;
  height: 2.65rem;
  min-width: 0;
  margin: 0;
  padding: 0 2.4rem 0 0.8rem;
  box-sizing: border-box;
  border: 1px solid #BFCEDC;
  border-radius: 10px;
  appearance: none;
  background: #FDFEFF;
  color: #17324D;
  font: inherit;
  font-size: 0.82rem;
  cursor: pointer;
}

.quota-pro-select-wrap select:focus {
  border-color: #3C8CCC;
  outline: 0;
  box-shadow: 0 0 0 3px rgba(60, 140, 204, 0.16);
}

.quota-pro-select-icon {
  position: absolute;
  top: 50%;
  right: 0.9rem;
  width: 0.55rem;
  height: 0.55rem;
  border-right: 2px solid #64748B;
  border-bottom: 2px solid #64748B;
  transform: translateY(-70%) rotate(45deg);
  pointer-events: none;
}

.quota-pro-profile {
  margin-top: 0.85rem;
  overflow: hidden;
  border: 1px solid #DCE6EF;
  border-radius: 14px;
  background: #FFFFFF;
  box-shadow: 0 6px 16px rgba(23, 50, 77, 0.06);
}

.quota-pro-profile-header {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) minmax(17rem, auto);
  align-items: center;
  gap: 0.8rem;
  padding: 0.9rem 1rem;
  border-bottom: 1px solid #E5ECF2;
  background: linear-gradient(90deg, #F5FAFD 0%, #FAF8FF 100%);
}

.quota-pro-avatar {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 12px;
  background: #DFF0EC;
  color: #18746E;
  font-size: 1rem;
  font-weight: 800;
}

.quota-pro-profile-identity {
  min-width: 0;
}

.quota-pro-profile-identity span {
  display: inline-block;
  padding: 0.16rem 0.38rem;
  border: 1px solid #D5E7EF;
  border-radius: 6px;
  background: #EFF7FB;
  color: #397FB3;
  font-size: 0.64rem;
  font-weight: 700;
  letter-spacing: 0.055em;
  text-transform: uppercase;
}

.quota-pro-profile-identity h3 {
  max-width: 100%;
  margin: 0.28rem 0 0;
  width: fit-content;
  padding: 0.2rem 0.48rem;
  box-sizing: border-box;
  overflow-wrap: anywhere;
  border: 1px solid #D9E8F0;
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.78);
  color: #235F89;
  font-size: 0.84rem;
  font-weight: 700;
  letter-spacing: -0.005em;
  line-height: 1.3;
}

.quota-pro-stats {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.5rem;
}

.quota-pro-stat {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-width: 0;
  gap: 0.5rem;
  padding: 0.55rem 0.65rem;
  border: 1px solid #E3EBF2;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.78);
}

.quota-pro-stat span {
  min-width: 0;
  overflow-wrap: anywhere;
  color: #64748B;
  font-size: 0.68rem;
  line-height: 1.25;
}

.quota-pro-stat strong {
  flex: 0 0 auto;
  color: #17324D;
  font-size: 1rem;
}

.quota-pro-field {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(13rem, 17rem);
  align-items: center;
  gap: 1rem;
  padding: 1rem;
}

.quota-pro-field-copy label {
  display: inline-block;
  width: fit-content;
  padding: 0.22rem 0.48rem;
  border: 1px solid #D6E8E1;
  border-radius: 7px;
  background: #EEF8F4;
  color: #294862;
  font-size: 0.76rem;
  font-weight: 700;
  letter-spacing: 0.005em;
}

.quota-pro-field-copy small {
  display: block;
  margin-top: 0.25rem;
  color: #718096;
  font-size: 0.72rem;
  line-height: 1.35;
}

.quota-pro-number-wrap {
  display: flex;
  align-items: stretch;
  min-width: 0;
  height: 2.65rem;
  overflow: hidden;
  border: 1px solid #BFCEDC;
  border-radius: 10px;
  background: #FDFEFF;
}

.quota-pro-number-wrap:focus-within {
  border-color: #3C8CCC;
  box-shadow: 0 0 0 3px rgba(60, 140, 204, 0.16);
}

.quota-pro-number-wrap input {
  width: 100%;
  min-width: 0;
  margin: 0;
  padding: 0 0.75rem;
  border: 0;
  outline: 0;
  background: transparent;
  color: #17324D;
  font: inherit;
  font-size: 0.86rem;
}

.quota-pro-number-wrap > span {
  display: inline-flex;
  align-items: center;
  flex: 0 0 auto;
  padding: 0 0.7rem;
  border-left: 1px solid #E0E8EF;
  background: #F1F5F9;
  color: #64748B;
  font-size: 0.72rem;
  white-space: nowrap;
}

.quota-pro-empty {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.55rem;
  min-height: 4.5rem;
  margin-top: 0.85rem;
  border: 1px dashed #CBD8E4;
  border-radius: 14px;
  background: #FBFDFE;
  color: #718096;
  font-size: 0.82rem;
}

.quota-pro-empty p {
  margin: 0;
}

.quota-pro-actions {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 0.6rem;
  margin-top: 0.85rem;
  padding-top: 0.85rem;
  border-top: 1px solid #DFE7EF;
}

.quota-pro-actions > input {
  width: auto !important;
  min-width: 0 !important;
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  max-height: 1.75rem !important;
  margin: 0 !important;
  padding-top: 2px !important;
  padding-bottom: 2px !important;
  box-sizing: border-box !important;
  border: 0 !important;
  border-radius: 20px !important;
  background-color: #F3F4F6 !important;
  color: #1F2937 !important;
  box-shadow: 0 7px 16px rgba(107, 114, 128, 0.36) !important;
  cursor: pointer;
  font: inherit;
  font-size: 0.85rem !important;
  font-weight: 700 !important;
}

.quota-pro-actions > input:hover,
.quota-pro-actions > input:focus {
  background-color: #E5E7EB !important;
  box-shadow: 0 7px 16px rgba(107, 114, 128, 0.38) !important;
}

/* Priorité sur les anciennes couleurs propres à la page Quota. */
.settings-page.espacest-quota-page .quota-pro-actions > input.espacest-quota-back,
.settings-page.espacest-quota-page .quota-pro-actions > input.espacest-quota-save {
  border: 0 !important;
  background: #F3F4F6 !important;
  color: #1F2937 !important;
  box-shadow: 0 7px 16px rgba(107, 114, 128, 0.36) !important;
}

.settings-page.espacest-quota-page .quota-pro-actions > input.espacest-quota-back:hover,
.settings-page.espacest-quota-page .quota-pro-actions > input.espacest-quota-back:focus,
.settings-page.espacest-quota-page .quota-pro-actions > input.espacest-quota-save:hover,
.settings-page.espacest-quota-page .quota-pro-actions > input.espacest-quota-save:focus {
  background: #E5E7EB !important;
  color: #1F2937 !important;
  box-shadow: 0 9px 20px rgba(107, 114, 128, 0.45) !important;
}

@media (max-width: 44rem) {
  .settings-page.espacest-quota-page {
    padding: 0 0.8rem 1.25rem !important;
  }

  .quota-pro-panel {
    margin-top: 0.8rem;
    padding: 0.8rem;
    border-radius: 12px;
  }

  .quota-pro-header {
    margin-bottom: 0.75rem;
    padding-bottom: 0.7rem;
  }

  .quota-pro-header h1 {
    font-size: 0.96rem;
  }

  .quota-pro-settings-grid {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.6rem;
  }

  .quota-pro-card {
    padding: 0.75rem;
    border-radius: 11px;
  }

  .quota-pro-profile {
    margin-top: 0.6rem;
    border-radius: 11px;
  }

  .quota-pro-profile-header {
    grid-template-columns: auto minmax(0, 1fr);
    gap: 0.65rem;
    padding: 0.75rem;
  }

  .quota-pro-stats {
    grid-column: 1 / -1;
  }

  .quota-pro-field {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.6rem;
    padding: 0.75rem;
  }

  .quota-pro-actions {
    justify-content: flex-start;
    margin-top: 0.65rem;
    padding-top: 0.65rem;
  }

  .quota-pro-actions > input {
    flex: 0 0 auto;
    width: auto !important;
    min-width: 0 !important;
  }
}

@media (max-width: 22rem) {
  .settings-page.espacest-quota-page {
    padding-left: 0.45rem !important;
    padding-right: 0.45rem !important;
  }

  .quota-pro-stats {
    grid-template-columns: minmax(0, 1fr);
  }

  .quota-pro-actions {
    flex-wrap: wrap;
  }

  .quota-pro-actions > input {
    width: 100% !important;
  }
}

/* Les essais de refonte ci-dessous sont conservés mais désactivés afin de
 * restaurer exactement l'aspect précédent de « Ajouter une réservation ». */
@supports (espacest-reservation-redesign: disabled) {

/* Ajouter une réservation — même identité visuelle que la page Quota. */
.edit_entry form.standard#main {
  float: none !important;
  display: flow-root !important;
  width: min(100%, 52rem) !important;
  max-width: calc(100% - 2rem) !important;
  margin: 2rem auto 0 !important;
  padding: 1.4rem !important;
  box-sizing: border-box !important;
  border: 1px solid #D8E2EC !important;
  border-radius: 18px !important;
  background: #F8FAFC !important;
  color: #17324D !important;
  box-shadow: 0 16px 38px rgba(23, 50, 77, 0.12) !important;
}

.edit_entry form.standard#main > fieldset {
  float: none !important;
  display: table !important;
  width: 100% !important;
  margin: 0 0 0.85rem !important;
  padding: 1rem !important;
  box-sizing: border-box !important;
  border: 1px solid #DCE6EF !important;
  border-radius: 14px !important;
  background: #FFFFFF !important;
  box-shadow: 0 6px 16px rgba(23, 50, 77, 0.06) !important;
}

.edit_entry form.standard#main > fieldset:last-child {
  margin-bottom: 0 !important;
}

.edit_entry form.standard#main > fieldset > legend {
  display: table !important;
  width: auto !important;
  max-width: calc(100% - 1rem) !important;
  margin: 0 0 0.35rem !important;
  padding: 0.35rem 0.7rem !important;
  box-sizing: border-box !important;
  border: 0 !important;
  border-radius: 9px !important;
  background: #E7F2FA !important;
  color: #2F78AD !important;
  font-size: 0.82rem !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
}

.edit_entry form.standard#main fieldset fieldset {
  border: 1px solid #E3EBF2 !important;
  border-radius: 11px !important;
  background: #FBFDFE !important;
  box-shadow: none !important;
}

.edit_entry form.standard#main fieldset fieldset > legend {
  color: #52667A !important;
  font-size: 0.76rem !important;
  font-weight: 800 !important;
}

.edit_entry form.standard#main label {
  color: #334E68 !important;
  font-size: 0.8rem !important;
  font-weight: 700 !important;
}

.edit_entry form.standard#main input[type="text"],
.edit_entry form.standard#main input[type="email"],
.edit_entry form.standard#main input[type="number"],
.edit_entry form.standard#main input[type="date"],
.edit_entry form.standard#main input[type="time"],
.edit_entry form.standard#main select,
.edit_entry form.standard#main textarea {
  min-height: 2.65rem !important;
  box-sizing: border-box !important;
  border: 1px solid #BFCEDC !important;
  border-radius: 10px !important;
  background-color: #FDFEFF !important;
  color: #17324D !important;
  font-size: 0.82rem !important;
  box-shadow: none !important;
}

.edit_entry form.standard#main input[type="text"]:focus,
.edit_entry form.standard#main input[type="email"]:focus,
.edit_entry form.standard#main input[type="number"]:focus,
.edit_entry form.standard#main input[type="date"]:focus,
.edit_entry form.standard#main input[type="time"]:focus,
.edit_entry form.standard#main select:focus,
.edit_entry form.standard#main textarea:focus {
  border-color: #3C8CCC !important;
  outline: 0 !important;
  box-shadow: 0 0 0 3px rgba(60, 140, 204, 0.16) !important;
}

.edit_entry form.standard#main textarea {
  min-height: 5.25rem !important;
}

.edit_entry form.standard#main .submit_buttons {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-flow: row wrap !important;
  gap: 0.6rem !important;
  width: 100% !important;
  margin-top: 0.5rem !important;
  padding-top: 0.85rem !important;
  border-top: 1px solid #DFE7EF !important;
}

.edit_entry form.standard#main .submit_buttons > label,
.edit_entry form.standard#main .submit_buttons > div {
  display: flex !important;
  align-items: center !important;
  width: auto !important;
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  margin: 0 !important;
  padding: 0 !important;
}

.edit_entry form.standard#main .submit_buttons input[type="submit"],
.espacest-report-page #report_form .report-pro-actions input.report-booking-action {
  width: auto !important;
  height: 1.75rem !important;
  min-width: 0 !important;
  min-height: 1.75rem !important;
  max-height: 1.75rem !important;
  margin: 0 !important;
  padding-top: 2px !important;
  padding-bottom: 2px !important;
  box-sizing: border-box !important;
  border: 0 !important;
  border-radius: 20px !important;
  background-color: #F3F4F6 !important;
  color: #1F2937 !important;
  box-shadow: 0 7px 16px rgba(107, 114, 128, 0.36) !important;
  font-size: 0.85rem !important;
  font-weight: 700 !important;
}

.edit_entry form.standard#main .submit_buttons input[type="submit"]:hover,
.edit_entry form.standard#main .submit_buttons input[type="submit"]:focus,
.espacest-report-page #report_form .report-pro-actions input.report-booking-action:hover,
.espacest-report-page #report_form .report-pro-actions input.report-booking-action:focus {
  background-color: #E5E7EB !important;
  color: #1F2937 !important;
  box-shadow: 0 9px 20px rgba(107, 114, 128, 0.45) !important;
}

.edit_entry form.standard#main .submit_buttons #checks {
  width: 100% !important;
  height: auto !important;
  margin: 0.35rem 0 0 !important;
}

@media (max-width: 44rem) {
  .edit_entry form.standard#main {
    width: calc(100% - 1.6rem) !important;
    max-width: calc(100% - 1.6rem) !important;
    margin: 0.8rem auto 0 !important;
    padding: 0.8rem !important;
    border-radius: 12px !important;
  }

  .edit_entry form.standard#main > fieldset {
    display: block !important;
    padding: 0.75rem !important;
    border-radius: 11px !important;
  }

  .edit_entry form.standard#main > fieldset > div {
    width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  .edit_entry form.standard#main input[type="text"],
  .edit_entry form.standard#main input[type="email"],
  .edit_entry form.standard#main input[type="number"],
  .edit_entry form.standard#main input[type="date"],
  .edit_entry form.standard#main input[type="time"],
  .edit_entry form.standard#main select,
  .edit_entry form.standard#main textarea {
    max-width: 100% !important;
  }

  .edit_entry form.standard#main .submit_buttons {
    justify-content: flex-start !important;
    flex-wrap: nowrap !important;
  }
}

@media (max-width: 22rem) {
  .edit_entry form.standard#main {
    width: calc(100% - 0.9rem) !important;
    max-width: calc(100% - 0.9rem) !important;
    padding: 0.6rem !important;
  }

  .edit_entry form.standard#main > fieldset {
    padding: 0.6rem !important;
  }
}

/* Le formulaire de réservation reste un panneau unique : les fieldsets
 * structurent le contenu sans créer de cartes visuellement différentes. */
.edit_entry form.standard#main > fieldset {
  margin: 0 !important;
  padding: 0.9rem 0.2rem !important;
  border: 0 !important;
  border-bottom: 1px solid #DFE7EF !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.edit_entry form.standard#main > fieldset:first-child {
  padding-top: 0.2rem !important;
}

.edit_entry form.standard#main > fieldset:last-child {
  padding-bottom: 0 !important;
  border-bottom: 0 !important;
}

.edit_entry form.standard#main fieldset fieldset {
  margin-top: 0.7rem !important;
  padding: 0.65rem 0 0.65rem 0.9rem !important;
  border: 0 !important;
  border-left: 2px solid #DCE8F1 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.edit_entry form.standard#main > fieldset > legend {
  margin-bottom: 0.4rem !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #17324D !important;
  font-size: 0.95rem !important;
}

@media (max-width: 44rem) {
  .edit_entry form.standard#main > fieldset {
    padding: 0.7rem 0 !important;
  }

  .edit_entry form.standard#main fieldset fieldset {
    padding: 0.55rem 0 0.55rem 0.65rem !important;
  }
}

/* Harmonisation stricte avec Quota : une seule surface, aucun bloc annexe. */
.edit_entry form.standard#main {
  width: min(100%, 52rem) !important;
  padding: 1.4rem !important;
  border: 1px solid #D8E2EC !important;
  border-radius: 18px !important;
  background: #F8FAFC !important;
  box-shadow: 0 16px 38px rgba(23, 50, 77, 0.12) !important;
}

.edit_entry form.standard#main fieldset,
.edit_entry form.standard#main fieldset fieldset {
  float: none !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0.75rem 0 !important;
  box-sizing: border-box !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.edit_entry form.standard#main > fieldset + fieldset {
  border-top: 1px solid #DFE7EF !important;
}

.edit_entry form.standard#main fieldset fieldset {
  padding-left: 0 !important;
}

.edit_entry form.standard#main > fieldset > legend,
.edit_entry form.standard#main fieldset fieldset > legend {
  width: auto !important;
  margin: 0 0 0.45rem !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #17324D !important;
  font-size: 0.9rem !important;
  font-weight: 800 !important;
}

.edit_entry form.standard#main > fieldset:first-child > legend {
  width: 100% !important;
  margin-bottom: 0.75rem !important;
  padding-bottom: 0.75rem !important;
  border-bottom: 1px solid #DFE7EF !important;
  color: #17324D !important;
  font-size: 1.45rem !important;
  line-height: 1.2 !important;
}

.edit_entry form.standard#main input[type="text"],
.edit_entry form.standard#main input[type="email"],
.edit_entry form.standard#main input[type="number"],
.edit_entry form.standard#main input[type="date"],
.edit_entry form.standard#main input[type="time"],
.edit_entry form.standard#main select,
.edit_entry form.standard#main textarea {
  border: 1px solid #BFCEDC !important;
  border-radius: 10px !important;
  background: #FDFEFF !important;
  color: #17324D !important;
}

@media (max-width: 44rem) {
  .edit_entry form.standard#main {
    width: calc(100% - 1.6rem) !important;
    max-width: calc(100% - 1.6rem) !important;
    margin-top: 0.8rem !important;
    padding: 0.8rem !important;
    border-radius: 12px !important;
  }

  .edit_entry form.standard#main fieldset,
  .edit_entry form.standard#main fieldset fieldset {
    padding: 0.6rem 0 !important;
  }

  .edit_entry form.standard#main > fieldset:first-child > legend {
    font-size: 1.2rem !important;
  }
}

/* Couleurs et position des actions strictement identiques à Quota. */
.edit_entry form.standard#main .submit_buttons {
  justify-content: flex-end !important;
  text-align: right !important;
}

.edit_entry form.standard#main .submit_buttons > label,
.edit_entry form.standard#main .submit_buttons > div {
  justify-content: flex-end !important;
}

.edit_entry form.standard#main .submit_buttons input[type="submit"],
.edit_entry form.standard#main .submit_buttons input[type="submit"].default_action {
  border: 0 !important;
  border-radius: 20px !important;
  background-color: #F3F4F6 !important;
  color: #1F2937 !important;
  box-shadow: 0 7px 16px rgba(107, 114, 128, 0.36) !important;
}

.edit_entry form.standard#main .submit_buttons input[type="submit"]:hover,
.edit_entry form.standard#main .submit_buttons input[type="submit"]:focus,
.edit_entry form.standard#main .submit_buttons input[type="submit"].default_action:hover,
.edit_entry form.standard#main .submit_buttons input[type="submit"].default_action:focus {
  background-color: #E5E7EB !important;
  color: #1F2937 !important;
  box-shadow: 0 9px 20px rgba(107, 114, 128, 0.45) !important;
}

/* Titre bleu et contrôles de validation centrés sous les deux actions. */
.edit_entry form.standard#main > fieldset:first-child > legend {
  color: #2F78AD !important;
}

.edit_entry form.standard#main .submit_buttons > div {
  display: contents !important;
}

.edit_entry form.standard#main .submit_buttons #checks {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  order: 3 !important;
  flex: 0 0 100% !important;
  width: 100% !important;
  min-height: 1.25rem !important;
  margin: 0.45rem 0 0 !important;
  padding: 0 !important;
  text-align: center !important;
}

.edit_entry form.standard#main .submit_buttons #checks > span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

}

/* La page Quota reprend le formulaire centré de « Ajouter une réservation ».
 * Ces règles finales neutralisent les anciennes variantes de mise en page. */
.settings-page.espacest-quota-page {
  float: none !important;
  width: fit-content !important;
  max-width: calc(100% - 2rem) !important;
  margin: 2rem auto 0 !important;
}

.settings-page.espacest-quota-page .espacest-quota-shell,
.settings-page.espacest-quota-page .espacest-quota-form-panel {
  width: fit-content !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Même ligne, même hauteur et même centrage que les actions du formulaire
 * de réservation. */
.settings-page.espacest-quota-page .espacest-user-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0.75rem !important;
  width: fit-content !important;
  margin: 1rem 0 0 !important;
  flex-wrap: wrap !important;
}

.settings-page.espacest-quota-page .espacest-user-actions > button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  max-height: 1.75rem !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding-top: 2px !important;
  padding-bottom: 2px !important;
  flex: 0 0 auto !important;
  white-space: nowrap !important;
}

/* Le champ du quota mensuel doit rester suffisamment large pour son libellé
 * et son contenu, comme les champs du formulaire de réservation. */
.settings-page.espacest-quota-page .espacest-quota-fields {
  grid-template-columns: minmax(0, 1fr) !important;
}

.settings-page.espacest-quota-page .espacest-quota-fields input[type="number"] {
  grid-column: 1 !important;
  grid-row: auto !important;
  width: 100% !important;
  min-width: 0 !important;
  max-width: none !important;
  min-height: 2.7rem !important;
  height: 2.7rem !important;
}

/* Même dimension explicite que le sélecteur utilisateur, y compris pour le
 * champ vide dont le placeholder affiche « illimité ». */
.settings-page.espacest-quota-page input.espacest-quota-user-input {
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  min-width: 0 !important;
  height: 2.5rem !important;
  min-height: 2.5rem !important;
  box-sizing: border-box !important;
  font-size: 1rem !important;
}

@media (max-width: 30rem) {
  .settings-page.espacest-quota-page {
    width: calc(100% - 1rem) !important;
    max-width: none !important;
    margin-top: 1rem !important;
  }

  .settings-page.espacest-quota-page .espacest-user-actions {
    flex-wrap: nowrap !important;
    gap: 0.5rem !important;
  }

  .settings-page.espacest-quota-page .espacest-quota-fields {
    grid-template-columns: 1fr !important;
  }

  .settings-page.espacest-quota-page .espacest-quota-fields input[type="number"] {
    width: 100% !important;
  }
}

/* Alignement final de « Quota » sur le formulaire « Ajouter une réservation ». */
.settings-page.espacest-quota-page {
  float: none !important;
  display: block !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 auto !important;
  padding: 0 1rem !important;
  box-sizing: border-box !important;
}

.settings-page.espacest-quota-page .espacest-quota-shell {
  width: 100% !important;
  max-width: none !important;
}

.settings-page.espacest-quota-page .espacest-quota-form-panel {
  float: none !important;
  width: min(46rem, 100%) !important;
  max-width: calc(100% - 2rem) !important;
  margin: 2rem auto 0 !important;
  padding: 1rem !important;
  box-sizing: border-box !important;
}

.settings-page.espacest-quota-page .espacest-quota-form-panel > .espacest-quota-header {
  margin-bottom: 0.75rem !important;
  padding-bottom: 0.6rem !important;
}

.settings-page.espacest-quota-page .espacest-quota-header h1 {
  font-size: 1.35rem !important;
}

.settings-page.espacest-quota-page .espacest-quota-form-panel .espacest-settings-card,
.settings-page.espacest-quota-page .espacest-quota-form-panel .espacest-user-selector,
.settings-page.espacest-quota-page .espacest-quota-form-panel .espacest-user-quota-panel {
  margin-bottom: 0.65rem !important;
  padding-top: 0.75rem !important;
  padding-bottom: 0.75rem !important;
}

.settings-page.espacest-quota-page .espacest-user-actions {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  flex-flow: row nowrap !important;
  gap: 0.75rem !important;
  width: 100% !important;
  margin: 1rem 0 0 !important;
  padding: 0 !important;
}

.settings-page.espacest-quota-page .espacest-user-actions > input {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  flex: 0 0 auto !important;
  width: auto !important;
  height: 1.75rem !important;
  min-width: 0 !important;
  min-height: 1.75rem !important;
  max-height: 1.75rem !important;
  margin: 0 !important;
  padding: 2px 1rem !important;
  box-sizing: border-box !important;
  border: 0 !important;
  border-radius: 20px !important;
  background-color: #F3F4F6 !important;
  color: #1F2937 !important;
  box-shadow: 0 7px 16px rgba(107, 114, 128, 0.36) !important;
  cursor: pointer !important;
  font: inherit !important;
  font-weight: 700 !important;
  white-space: nowrap !important;
}

.settings-page.espacest-quota-page .espacest-user-actions > input:hover,
.settings-page.espacest-quota-page .espacest-user-actions > input:focus {
  background-color: #E5E7EB !important;
  color: #1F2937 !important;
  box-shadow: 0 9px 20px rgba(107, 114, 128, 0.45) !important;
}

/* Les informations de réservation restent à droite sur grand écran, sans
 * jamais dépasser la largeur disponible. */
.settings-page.espacest-quota-page .espacest-user-heading,
.settings-page.espacest-quota-page .espacest-quota-stats {
  width: min(100%, 30rem) !important;
  max-width: 100% !important;
  margin-left: auto !important;
  margin-right: 0 !important;
  box-sizing: border-box !important;
}

.settings-page.espacest-quota-page .espacest-user-heading > div {
  min-width: 0 !important;
  max-width: 100% !important;
}

.settings-page.espacest-quota-page .espacest-user-heading {
  margin-bottom: 0.7rem !important;
  padding-bottom: 0.65rem !important;
}

.settings-page.espacest-quota-page .espacest-user-heading h3,
.settings-page.espacest-quota-page .espacest-eyebrow {
  max-width: 100% !important;
  overflow-wrap: anywhere !important;
}

.settings-page.espacest-quota-page .espacest-stat {
  min-width: 0 !important;
  max-width: 100% !important;
  min-height: 3rem !important;
  padding: 0.6rem 0.75rem !important;
  box-sizing: border-box !important;
}

.settings-page.espacest-quota-page .espacest-stat span {
  min-width: 0 !important;
  overflow-wrap: anywhere !important;
}

.settings-page.espacest-quota-page .espacest-stat strong {
  flex: 0 0 auto !important;
}

@media (max-width: 40rem) {
  .settings-page.espacest-quota-page {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
  }

  .settings-page.espacest-quota-page .espacest-quota-form-panel {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-top: 0.75rem !important;
    padding: 0.8rem !important;
    border-radius: 10px !important;
  }

  .settings-page.espacest-quota-page .espacest-quota-header h1 {
    font-size: 1.1rem !important;
  }

  .settings-page.espacest-quota-page .espacest-quota-form-panel > .espacest-quota-header {
    margin-bottom: 0.5rem !important;
    padding-bottom: 0.5rem !important;
  }

  .settings-page.espacest-quota-page .espacest-quota-intro,
  .settings-page.espacest-quota-page .espacest-card-description {
    overflow-wrap: anywhere !important;
  }

  .settings-page.espacest-quota-page .espacest-settings-card,
  .settings-page.espacest-quota-page .espacest-user-selector,
  .settings-page.espacest-quota-page .espacest-user-quota-panel {
    min-width: 0 !important;
    margin-bottom: 0.5rem !important;
    padding-top: 0.6rem !important;
    padding-bottom: 0.6rem !important;
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
  }

  .settings-page.espacest-quota-page .espacest-user-selector {
    grid-template-columns: 1.8rem minmax(0, 1fr) !important;
  }

  .settings-page.espacest-quota-page .espacest-user-heading {
    margin-bottom: 0.6rem !important;
    padding-bottom: 0.55rem !important;
  }

  .settings-page.espacest-quota-page .espacest-user-selector select,
  .settings-page.espacest-quota-page .espacest-quota-fields,
  .settings-page.espacest-quota-page .espacest-quota-fields input[type="number"] {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  .settings-page.espacest-quota-page .espacest-quota-fields {
    padding: 0.65rem !important;
  }

  .settings-page.espacest-quota-page .espacest-user-heading,
  .settings-page.espacest-quota-page .espacest-quota-stats {
    grid-template-columns: minmax(0, 1fr) !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    margin-bottom: 0.65rem !important;
    gap: 0.4rem !important;
  }

  .settings-page.espacest-quota-page .espacest-stat {
    min-width: 0 !important;
    min-height: 2.7rem !important;
    gap: 0.5rem !important;
    padding: 0.5rem 0.65rem !important;
  }

  .settings-page.espacest-quota-page .espacest-stat span {
    overflow-wrap: anywhere !important;
  }

  .settings-page.espacest-quota-page .espacest-user-actions {
    width: 100% !important;
    max-width: 22rem !important;
    gap: 0.5rem !important;
    margin-top: 0.65rem !important;
  }

  .settings-page.espacest-quota-page .espacest-user-actions > input {
    flex: 1 1 0 !important;
    width: 50% !important;
    min-width: 0 !important;
    padding-left: 1.9rem !important;
    padding-right: 0.75rem !important;
    font-size: 0.82rem !important;
  }
}

/* Priorité finale : les deux actions doivent occuper deux colonnes voisines. */
.settings-page.quota-page .quota-save-actions {
  display: grid !important;
  grid-template-columns: max-content max-content !important;
  grid-auto-flow: column !important;
  align-items: center !important;
  justify-content: start !important;
  column-gap: 0.5rem !important;
  width: max-content !important;
  max-width: 100% !important;
  white-space: nowrap !important;
}

.settings-page.quota-page .quota-save-actions > .quota-back-button,
.settings-page.quota-page .quota-save-actions > .quota-save-bottom {
  grid-column: auto !important;
  grid-row: 1 !important;
  justify-self: start !important;
  width: max-content !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  white-space: nowrap !important;
}

/* Les actions de la page Quotas restent côte à côte. */
.settings-page.quota-page .quota-edit-form .quota-save-actions,
.settings-page.quota-page > .quota-main-card > .quota-save-actions {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 0.5rem !important;
  width: max-content !important;
  max-width: 100% !important;
  grid-column: 1 / -1 !important;
}

.settings-page.quota-page .quota-save-actions > input {
  display: inline-flex !important;
  width: auto !important;
  min-width: max-content !important;
  max-width: none !important;
  flex: 0 0 auto !important;
  margin: 0 !important;
  white-space: nowrap !important;
}

/* Présentation historique de la page Quotas, conservée avec les nouveaux boutons. */
.settings-page.quota-page .quota-selector {
  display: flex !important;
  flex-direction: column !important;
  align-items: stretch !important;
  gap: 0.6rem !important;
  width: 100% !important;
  margin: 1.25rem 0 !important;
  padding: 1rem 1.25rem !important;
  box-sizing: border-box !important;
  border: 1px solid #CBD5E1 !important;
  border-radius: 8px !important;
  background: #FFFFFF !important;
  box-shadow: 0 4px 10px rgba(23, 50, 77, 0.12) !important;
}

.settings-page.quota-page .quota-selector .quota-step-number {
  display: inline-flex !important;
  position: static !important;
  align-self: flex-start !important;
}

.settings-page.quota-page .quota-selector label,
.settings-page.quota-page .quota-selector select {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

.settings-page.quota-page .quota-selector select {
  height: 2.1rem !important;
  min-height: 2.1rem !important;
}

.settings-page.quota-page .quota-edit-card {
  width: 100% !important;
  margin: 1.25rem 0 !important;
  padding: 1rem 1.25rem !important;
  box-sizing: border-box !important;
  border: 1px solid #CBD5E1 !important;
  border-radius: 8px !important;
  background: #F8FAFC !important;
  box-shadow: 0 5px 14px rgba(23, 50, 77, 0.14) !important;
}

.settings-page.quota-page .quota-user-heading {
  margin-bottom: 0.8rem !important;
  padding-bottom: 0 !important;
  border-bottom: 0 !important;
}

.settings-page.quota-page .quota-stats {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0.75rem !important;
  margin-bottom: 1rem !important;
}

.settings-page.quota-page .quota-stat {
  min-height: 0 !important;
  padding: 0.75rem 0.9rem !important;
}

.settings-page.quota-page .quota-edit-form {
  grid-template-columns: minmax(0, 1fr) 12rem !important;
  width: 100% !important;
  max-width: none !important;
  gap: 0.5rem 1rem !important;
  padding-top: 1rem !important;
}

.settings-page.quota-page .quota-edit-form label {
  grid-column: 1 !important;
}

.settings-page.quota-page .quota-edit-form input[type="number"] {
  grid-column: 2 !important;
  grid-row: 1 / span 2 !important;
  width: 12rem !important;
  max-width: 100% !important;
  height: 2.1rem !important;
  min-height: 2.1rem !important;
}

@media (max-width: 40rem) {
  .settings-page.quota-page .quota-selector,
  .settings-page.quota-page .quota-edit-card {
    padding: 0.85rem !important;
  }

  .settings-page.quota-page .quota-stats,
  .settings-page.quota-page .quota-edit-form {
    grid-template-columns: 1fr !important;
  }

  .settings-page.quota-page .quota-edit-form input[type="number"] {
    grid-column: 1 !important;
    grid-row: auto !important;
    width: 100% !important;
  }
}

/* Nouvelle mise en page : informations séparées en blocs lisibles. */
.settings-page.quota-page .quota-section {
  margin-top: 1.75rem !important;
  padding-top: 1.35rem !important;
  border-top: 1px solid #E5EDF3 !important;
}

.settings-page.quota-page .quota-section h4 {
  margin: 0 0 0.9rem !important;
  color: #17324D !important;
  font-size: 1rem !important;
  font-weight: 750 !important;
}

.settings-page.quota-page .quota-statistics-section {
  margin-top: 0 !important;
  padding-top: 0 !important;
  border-top: 0 !important;
}

.settings-page.quota-page .quota-monthly-section {
  margin-top: 1.75rem !important;
}

.settings-page.quota-page .quota-monthly-section .quota-edit-form {
  margin-top: 0 !important;
  padding-top: 0 !important;
  border-top: 0 !important;
}

.settings-page.quota-page .quota-monthly-section .quota-save-actions {
  margin-top: 1.35rem !important;
  padding-top: 1rem !important;
  border-top: 1px solid #E5EDF3 !important;
}

@media (max-width: 40rem) {
  .settings-page.quota-page .quota-section {
    margin-top: 1.35rem !important;
    padding-top: 1rem !important;
  }
}

/* Retour à la présentation compacte précédente de la carte utilisateur. */
.settings-page.quota-page .quota-selector {
  grid-template-columns: 1rem minmax(0, 1fr) !important;
  gap: 0.45rem 0.7rem !important;
  margin: 0 0 0.75rem !important;
  padding: 0.9rem !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.settings-page.quota-page .quota-selector select {
  min-height: 2.1rem !important;
  height: 2.1rem !important;
  padding: 0.35rem 0.65rem !important;
}

.settings-page.quota-page .quota-edit-card {
  margin: 0 !important;
  padding: 1.25rem !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.settings-page.quota-page .quota-user-heading {
  margin-bottom: 0.8rem !important;
  padding-bottom: 0 !important;
  border-bottom: 0 !important;
}

.settings-page.quota-page .quota-user-heading h3 {
  margin-top: 0.2rem !important;
  font-size: 1.15rem !important;
}

.settings-page.quota-page .quota-stats {
  grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  gap: 0.6rem !important;
  margin-bottom: 0.85rem !important;
}

.settings-page.quota-page .quota-stat {
  min-height: 0 !important;
  padding: 0.65rem 0.8rem !important;
}

.settings-page.quota-page .quota-edit-form {
  grid-template-columns: 12rem !important;
  width: 12rem !important;
  max-width: 100% !important;
  gap: 0.35rem !important;
  padding-top: 0.8rem !important;
}

.settings-page.quota-page .quota-edit-form label,
.settings-page.quota-page .quota-edit-form input[type="number"] {
  width: 12rem !important;
  max-width: 100% !important;
}

.settings-page.quota-page .quota-edit-form input[type="number"] {
  height: 2.1rem !important;
  min-height: 2.1rem !important;
  font-size: 0.85rem !important;
}

@media (max-width: 40rem) {
  .settings-page.quota-page .quota-selector,
  .settings-page.quota-page .quota-edit-card {
    padding: 0.9rem !important;
  }

  .settings-page.quota-page .quota-stats {
    grid-template-columns: 1fr !important;
  }

  .settings-page.quota-page .quota-edit-form,
  .settings-page.quota-page .quota-edit-form label,
  .settings-page.quota-page .quota-edit-form input[type="number"] {
    width: 100% !important;
    max-width: none !important;
  }
}

/* Priorité finale : les deux actions doivent rester sur la même ligne. */
.settings-page.quota-page .quota-save-actions {
  display: grid !important;
  grid-template-columns: max-content max-content !important;
  grid-auto-flow: column !important;
  align-items: center !important;
  justify-content: start !important;
  column-gap: 0.5rem !important;
  width: max-content !important;
  max-width: 100% !important;
  white-space: nowrap !important;
}

.settings-page.quota-page .quota-save-actions > .quota-back-button,
.settings-page.quota-page .quota-save-actions > .quota-save-bottom {
  grid-column: auto !important;
  grid-row: 1 !important;
  justify-self: start !important;
  width: max-content !important;
  min-width: 0 !important;
  max-width: none !important;
  margin: 0 !important;
  white-space: nowrap !important;
}

/* Priorité absolue finale : action Effacer une réservation. */
html body .booking-detail-page #view_entry_nav input.booking-delete-action,
html body .contents .booking-detail-page #view_entry_nav form[action*="del_entry.php"] input[type="submit"] {
  opacity: 1 !important;
  border: 1px solid #B74740 !important;
  background-color: #C95B52 !important;
  background-image: none !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  box-shadow: 0 5px 12px rgba(183, 71, 64, 0.3) !important;
  appearance: none !important;
}

html body .booking-detail-page #view_entry_nav input.booking-delete-action:hover,
html body .booking-detail-page #view_entry_nav input.booking-delete-action:focus,
html body .contents .booking-detail-page #view_entry_nav form[action*="del_entry.php"] input[type="submit"]:hover,
html body .contents .booking-detail-page #view_entry_nav form[action*="del_entry.php"] input[type="submit"]:focus {
  border-color: #963730 !important;
  background-color: #AD463E !important;
  background-image: none !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  box-shadow: 0 7px 16px rgba(150, 55, 48, 0.36) !important;
}

/* Couleur commune de toutes les actions de suppression du site. */
html body .contents .user-edit-page form#form_edit_users input#delete_user_button,
html body .booking-detail-page #view_entry_nav input.booking-delete-action,
html body button#delete_button,
html body button[formaction*="del.php"],
html body form[action*="del.php"] input[type="submit"],
html body form[action*="del_entry.php"] input[type="submit"],
html body input[name="delete_button"],
html body input.user-delete-action {
  opacity: 1 !important;
  border: 1px solid #B74740 !important;
  border-radius: 999px !important;
  background-color: #C95B52 !important;
  background-image: none !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  box-shadow: 0 5px 12px rgba(183, 71, 64, 0.3) !important;
  appearance: none !important;
}

html body .contents .user-edit-page form#form_edit_users input#delete_user_button:hover,
html body .contents .user-edit-page form#form_edit_users input#delete_user_button:focus,
html body .booking-detail-page #view_entry_nav input.booking-delete-action:hover,
html body .booking-detail-page #view_entry_nav input.booking-delete-action:focus,
html body button#delete_button:hover,
html body button#delete_button:focus,
html body button[formaction*="del.php"]:hover,
html body button[formaction*="del.php"]:focus,
html body form[action*="del.php"] input[type="submit"]:hover,
html body form[action*="del.php"] input[type="submit"]:focus,
html body form[action*="del_entry.php"] input[type="submit"]:hover,
html body form[action*="del_entry.php"] input[type="submit"]:focus,
html body input[name="delete_button"]:hover,
html body input[name="delete_button"]:focus,
html body input.user-delete-action:hover,
html body input.user-delete-action:focus {
  border-color: #963730 !important;
  background-color: #AD463E !important;
  background-image: none !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  box-shadow: 0 7px 16px rgba(150, 55, 48, 0.36) !important;
}

/* Les icônes de suppression de salle conservent leur pictogramme. */
html body form[action*="del.php"] input[type="image"] {
  width: 1.75rem !important;
  height: 1.75rem !important;
  box-sizing: border-box !important;
  padding: 0.32rem !important;
  border: 1px solid #B74740 !important;
  border-radius: 50% !important;
  background-color: #C95B52 !important;
  box-shadow: 0 5px 12px rgba(183, 71, 64, 0.3) !important;
}

html body form[action*="del.php"] input[type="image"]:hover,
html body form[action*="del.php"] input[type="image"]:focus {
  border-color: #963730 !important;
  background-color: #AD463E !important;
  box-shadow: 0 7px 16px rgba(150, 55, 48, 0.36) !important;
}

html body .contents .user-edit-page form#form_edit_users input#delete_user_button:disabled,
html body .booking-detail-page #view_entry_nav input.booking-delete-action:disabled,
html body button#delete_button:disabled,
html body button[formaction*="del.php"]:disabled,
html body form[action*="del.php"] input:disabled,
html body form[action*="del_entry.php"] input:disabled,
html body input[name="delete_button"]:disabled,
html body input.user-delete-action:disabled {
  border-color: #CBD5DF !important;
  background-color: #EEF2F5 !important;
  color: #8796A3 !important;
  -webkit-text-fill-color: #8796A3 !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
}

/* Suppression directe depuis la liste Mes réservations. */
.user-report-page .user-report-list-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) max-content;
  align-items: stretch;
  background: var(--reservation-bg);
}

.user-report-page .user-report-list-row > a.user-report-list-item {
  min-width: 0;
}

.user-report-page .user-report-delete-form {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0;
  padding: 0.4rem 0.6rem 0.4rem 0.45rem;
  border-left: 1px solid var(--reservation-accent-soft);
  background: var(--reservation-bg);
}

html body .user-report-page .user-report-delete-form input.user-report-delete-action {
  width: auto !important;
  min-width: 0 !important;
  height: 1.65rem !important;
  min-height: 1.65rem !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 0.18rem 0.62rem !important;
  border: 1px solid #B74740 !important;
  border-radius: 999px !important;
  background-color: #C95B52 !important;
  background-image: none !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  box-shadow: 0 4px 10px rgba(183, 71, 64, 0.26) !important;
  font-size: 0.64rem !important;
  font-weight: 750 !important;
  line-height: 1 !important;
}

html body .user-report-page .user-report-delete-form input.user-report-delete-action:hover,
html body .user-report-page .user-report-delete-form input.user-report-delete-action:focus {
  border-color: #963730 !important;
  background-color: #AD463E !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  box-shadow: 0 6px 14px rgba(150, 55, 48, 0.34) !important;
}

@media (max-width: 30rem) {
  .user-report-page .user-report-list-row {
    grid-template-columns: minmax(0, 1fr);
  }

  .user-report-page .user-report-delete-form {
    justify-content: flex-end;
    padding: 0 0.5rem 0.45rem;
    border-left: 0;
  }
}

/* ==========================================================================
 * Gestion des utilisateurs : même identité que Mes réservations.
 * ========================================================================== */

.settings-page.user-management-page {
  box-sizing: border-box;
  width: calc(100% - 2rem);
  max-width: 46rem !important;
  margin: 1.25rem auto 2rem !important;
  padding: 0 0 1rem !important;
  overflow: hidden;
  border: 1px solid #D8E2EC;
  border-radius: 18px;
  background: #F8FAFC;
  box-shadow: 0 16px 38px rgba(23, 50, 77, 0.1);
  color: #17324D;
}

.user-management-page .user-management-header {
  padding: 1rem;
  border-bottom: 1px solid #D8E2EC;
  background: linear-gradient(125deg, #EAF5FF 0%, #F1EEFF 51%, #EAF9F1 100%);
}

.user-management-page .user-management-heading {
  display: flex;
  align-items: center;
  gap: 0.65rem;
}

.user-management-page .user-management-title-icon {
  display: inline-flex;
  flex: 0 0 2.15rem;
  align-items: center;
  justify-content: center;
  width: 2.15rem;
  height: 2.15rem;
  border: 1px solid rgba(60, 140, 204, 0.22);
  border-radius: 11px;
  background: rgba(255, 255, 255, 0.82);
  color: #2F78AD;
  box-shadow: 0 5px 13px rgba(47, 120, 173, 0.14);
}

.user-management-page .user-management-title-icon svg {
  width: 1.2rem;
  height: 1.2rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.user-management-page .user-management-heading h2 {
  flex: 1 1 auto;
  margin: 0 !important;
  color: #17324D !important;
  font-size: 1.08rem !important;
  font-weight: 750 !important;
  line-height: 1.25;
}

.user-management-page .user-management-count {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  min-width: 1.75rem;
  height: 1.75rem;
  box-sizing: border-box;
  padding: 0 0.5rem;
  border: 1px solid #B9DEC9;
  border-radius: 999px;
  background: #ECF9F2;
  color: #256747;
  box-shadow: 0 4px 10px rgba(37, 103, 71, 0.12);
  font-size: 0.75rem;
  font-weight: 750;
}

.user-management-page .user-management-intro {
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
  margin-top: 0.75rem;
  padding: 0.6rem 0.7rem;
  border: 1px solid rgba(60, 140, 204, 0.18);
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.62);
  color: #496278;
}

.user-management-page .user-management-intro p {
  margin: 0;
  font-size: 0.79rem;
  line-height: 1.5;
}

.user-management-page .user-management-info-icon {
  display: inline-flex;
  flex: 0 0 1.2rem;
  align-items: center;
  justify-content: center;
  width: 1.2rem;
  height: 1.2rem;
  margin-top: 0.05rem;
  border-radius: 50%;
  background: #DCEEFF;
  color: #2F78AD;
  font-size: 0.7rem;
  font-weight: 800;
}

.user-management-page form#add_new_user {
  margin: 0.75rem 0 0;
}

.user-management-page form#add_new_user input[type="submit"] {
  width: auto !important;
  min-width: 0 !important;
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  box-sizing: border-box;
  padding: 0.2rem 0.8rem !important;
  border: 1px solid #62AB83 !important;
  border-radius: 999px !important;
  background: #72C69A !important;
  color: #173F2E !important;
  box-shadow: 0 5px 12px rgba(63, 133, 94, 0.2) !important;
  font-size: 0.7rem !important;
  font-weight: 750 !important;
}

.user-management-page form#add_new_user input[type="submit"]:hover,
.user-management-page form#add_new_user input[type="submit"]:focus {
  border-color: #4C946C !important;
  background: #5DB788 !important;
  box-shadow: 0 7px 16px rgba(63, 133, 94, 0.28) !important;
}

.contents .user-management-page #user_list.datatable_container {
  width: auto;
  box-sizing: border-box;
  margin: 1rem 1rem 0;
  overflow-x: auto !important;
  border: 1px solid #D8E2EC !important;
  border-radius: 13px !important;
  background: #FFFFFF !important;
  box-shadow: 0 7px 18px rgba(23, 50, 77, 0.08) !important;
}

.user-management-page #users_table {
  width: 100% !important;
  margin: 0 !important;
  border-collapse: separate !important;
  border-spacing: 0 !important;
  color: #17324D;
  font-size: 0.72rem !important;
}

.contents .user-management-page #users_table thead th {
  height: auto !important;
  padding: 0.62rem 0.7rem !important;
  border: 0 !important;
  border-bottom: 1px solid #D8E2EC !important;
  background: #EAF5FC !important;
  color: #3D5870 !important;
  font-size: 0.64rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.025em;
  text-align: left;
  text-transform: uppercase;
  white-space: nowrap;
}

.contents .user-management-page #users_table tbody tr {
  background: #F4FAFF !important;
  transition: background-color 160ms ease, box-shadow 160ms ease;
}

.contents .user-management-page #users_table tbody tr:has(a.user-edit-link) {
  cursor: pointer;
}

.contents .user-management-page #users_table tbody tr:hover {
  background: #E8F5FF !important;
  box-shadow: inset 3px 0 0 #5B9FCE;
}

.contents .user-management-page #users_table tbody td {
  height: auto !important;
  padding: 0.58rem 0.7rem !important;
  border: 0 !important;
  border-bottom: 1px solid #DDE9F1 !important;
  background: transparent !important;
  color: #3D5870 !important;
  font-size: 0.7rem !important;
  line-height: 1.3;
  vertical-align: middle;
  white-space: nowrap;
}

.contents .user-management-page #users_table tbody tr:last-child td {
  border-bottom: 0 !important;
}

.user-management-page #users_table .admin-user-name {
  color: #B7443E !important;
  font-weight: 780;
}

.user-management-page #users_table a.user-edit-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.55rem;
  box-sizing: border-box;
  padding: 0.15rem 0.62rem;
  border: 1px solid #BFD8E9;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.78);
  color: #246E9F;
  box-shadow: 0 4px 9px rgba(47, 120, 173, 0.12);
  font-size: 0.64rem;
  font-weight: 750;
  text-decoration: none;
}

.user-management-page #users_table a.user-edit-link:hover,
.user-management-page #users_table a.user-edit-link:focus {
  border-color: #8EBBD7;
  background: #DDEFFC;
  color: #174F77;
}

.user-management-page .dataTables_wrapper {
  color: #496278;
  font-size: 0.7rem;
}

.user-management-page .dataTables_wrapper .dataTables_filter,
.user-management-page .dataTables_wrapper .dt-buttons {
  margin: 0.65rem !important;
}

@media (max-width: 44rem) {
  .settings-page.user-management-page {
    width: calc(100% - 1rem);
    margin-top: 0.75rem !important;
  }

  .user-management-page .user-management-header {
    padding: 0.85rem;
  }

  .contents .user-management-page #user_list.datatable_container {
    margin: 0.75rem 0.75rem 0;
  }
}

/* Gestion des utilisateurs — annuaire clair, filtrable et responsive. */
.settings-page.user-management-page {
  max-width: 68rem !important;
  padding-bottom: 1.2rem !important;
}

.user-management-page .user-management-header {
  position: relative;
  padding: 1.15rem 1.25rem;
}

.user-management-page .user-management-heading h2 {
  font-size: 1.18rem !important;
}

.user-management-page .user-management-heading {
  padding-right: 15rem;
}

.user-management-page .user-management-intro {
  max-width: 46rem;
}

.user-management-page form#add_new_user {
  position: absolute;
  top: 1.08rem;
  right: 4.6rem;
  margin: 0;
}

.user-management-page form#add_new_user input[type="submit"] {
  width: auto !important;
  min-width: 0 !important;
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  max-height: 1.75rem !important;
  box-sizing: border-box !important;
  padding: 2px 0.8rem !important;
  border: 0 !important;
  border-radius: 20px !important;
  background: #F3F4F6 !important;
  color: #1F2937 !important;
  box-shadow: 0 7px 16px rgba(107, 114, 128, 0.36) !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
}

.user-management-page form#add_new_user input[type="submit"]:hover,
.user-management-page form#add_new_user input[type="submit"]:focus {
  border: 0 !important;
  background: #E5E7EB !important;
  color: #1F2937 !important;
  box-shadow: 0 9px 20px rgba(107, 114, 128, 0.45) !important;
}

.user-management-page .user-management-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.65rem;
  padding: 1rem 1.25rem 0;
}

.user-management-page .user-summary-card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 3.2rem;
  box-sizing: border-box;
  padding: 0.65rem 0.8rem;
  border: 1px solid #D9E6EE;
  border-radius: 12px;
  background: #FFFFFF;
  color: #496278;
  box-shadow: 0 5px 14px rgba(23, 50, 77, 0.06);
  font-family: inherit;
  text-align: left;
  cursor: pointer;
  transition: border-color 150ms ease, box-shadow 150ms ease, transform 150ms ease;
}

.user-management-page .user-summary-card:hover,
.user-management-page .user-summary-card:focus-visible {
  border-color: #8FBBD7;
  box-shadow: 0 8px 18px rgba(23, 50, 77, 0.12);
  transform: translateY(-1px);
}

.user-management-page .user-summary-card.is-active {
  border-color: #4B93C5;
  box-shadow: 0 0 0 3px rgba(75, 147, 197, 0.14),
              0 8px 18px rgba(23, 50, 77, 0.1);
}

.user-management-page .user-summary-card span {
  font-size: 0.74rem;
  font-weight: 700;
}

.user-management-page .user-summary-card strong {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2rem;
  height: 2rem;
  border-radius: 9px;
  background: #EAF5FC;
  color: #246E9F;
  font-size: 0.95rem;
}

.user-management-page .user-summary-admin strong {
  background: #FFF0EF;
  color: #A5413B;
}

.user-management-page .user-summary-standard strong {
  background: #ECF8F1;
  color: #28704B;
}

.user-management-page .user-management-toolbar {
  display: grid;
  grid-template-columns: minmax(15rem, 1fr);
  align-items: center;
  gap: 0.65rem 1rem;
  padding: 1rem 1.25rem 0;
}

.user-management-page .user-search-copy {
  display: flex;
  flex-direction: column;
  gap: 0.15rem;
}

.user-management-page .user-search-copy strong {
  color: #17324D;
  font-size: 0.82rem;
}

.user-management-page .user-search-copy span {
  color: #698094;
  font-size: 0.68rem;
  line-height: 1.4;
}

.user-management-page .user-search-control {
  position: relative;
}

.user-management-page .user-search-field {
  position: relative;
  display: flex;
  align-items: center;
}

.user-management-page .user-search-field svg {
  position: absolute;
  left: 0.75rem;
  width: 1rem;
  height: 1rem;
  fill: none;
  stroke: #668196;
  stroke-width: 1.8;
  stroke-linecap: round;
  pointer-events: none;
}

.user-management-page .user-search-field input {
  width: 100%;
  height: 2.4rem;
  box-sizing: border-box;
  padding: 0.45rem 2.5rem 0.45rem 2.25rem;
  border: 1px solid #C8D8E4;
  border-radius: 11px;
  background: #FFFFFF;
  color: #17324D;
  font-size: 0.76rem;
  outline: none;
  transition: border-color 150ms ease, box-shadow 150ms ease;
}

.user-management-page .user-search-clear {
  position: absolute;
  top: 50%;
  right: 0.45rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.55rem;
  height: 1.55rem;
  min-height: 0;
  padding: 0;
  border: 0;
  border-radius: 50%;
  background: #E8F0F5;
  color: #48677D;
  box-shadow: none;
  font-size: 1rem;
  line-height: 1;
  transform: translateY(-50%);
  cursor: pointer;
}

.user-management-page .user-search-clear[hidden] {
  display: none !important;
}

.user-management-page .user-search-clear:hover,
.user-management-page .user-search-clear:focus {
  background: #D7E7F1;
  color: #17324D;
  box-shadow: none;
  transform: translateY(-50%);
}

.user-management-page .user-search-field input:focus {
  border-color: #4B93C5;
  box-shadow: 0 0 0 3px rgba(75, 147, 197, 0.15);
}

.user-management-page .user-role-filters {
  display: inline-flex;
  gap: 0.25rem;
  padding: 0.22rem;
  border: 1px solid #D6E2EA;
  border-radius: 11px;
  background: #EDF3F7;
}

.user-management-page .user-role-filters button {
  min-height: 1.9rem;
  padding: 0.3rem 0.65rem;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: #587085;
  box-shadow: none;
  font-size: 0.68rem;
  font-weight: 720;
  cursor: pointer;
}

.user-management-page .user-role-filters button:hover {
  color: #235F89;
}

.user-management-page .user-role-filters button.is-active {
  background: #FFFFFF;
  color: #235F89;
  box-shadow: 0 3px 8px rgba(23, 50, 77, 0.12);
}

.user-management-page .user-results-feedback {
  grid-column: 1 / -1;
  min-height: 1rem;
  margin: -0.1rem 0 0;
  color: #698094;
  font-size: 0.67rem;
  font-weight: 650;
}

.user-management-page .user-directory-heading {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin: 0.35rem 1.25rem 0;
  padding-top: 0.8rem;
  border-top: 1px solid #DFE8EF;
}

.user-management-page .user-directory-heading h3 {
  margin: 0;
  color: #17324D;
  font-size: 0.88rem;
  font-weight: 780;
}

.user-management-page .user-directory-heading p {
  margin: 0.18rem 0 0;
  color: #71889B;
  font-size: 0.66rem;
  line-height: 1.4;
}

.user-management-page .user-directory-count {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  min-width: 1.9rem;
  height: 1.9rem;
  box-sizing: border-box;
  padding: 0 0.55rem;
  border: 1px solid #BBD9EC;
  border-radius: 999px;
  background: #EAF5FC;
  color: #246E9F;
  font-size: 0.7rem;
  font-weight: 800;
}

.user-management-page .user-directory-actions {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 0.55rem;
}

.user-management-page .user-view-switch {
  display: inline-flex;
  gap: 0.2rem;
  padding: 0.2rem;
  border: 1px solid #D6E2EA;
  border-radius: 10px;
  background: #EDF3F7;
}

.user-management-page .user-view-switch button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.3rem;
  min-height: 1.8rem;
  padding: 0.28rem 0.55rem;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: #587085;
  box-shadow: none;
  font-family: inherit;
  font-size: 0.65rem;
  font-weight: 750;
  cursor: pointer;
}

.user-management-page .user-view-switch button:hover,
.user-management-page .user-view-switch button:focus-visible {
  color: #235F89;
}

.user-management-page .user-view-switch button.is-active {
  background: #FFFFFF;
  color: #235F89;
  box-shadow: 0 3px 8px rgba(23, 50, 77, 0.12);
}

.contents .user-management-page #user_list.datatable_container {
  margin: 0.55rem 1.25rem 0;
  overflow: visible !important;
}

.user-management-page #users_table {
  table-layout: fixed;
}

.user-management-page #users_table th:nth-child(1) { width: 32%; }
.user-management-page #users_table th:nth-child(2) { width: 31%; }
.user-management-page #users_table th:nth-child(3) { width: 17%; }
.user-management-page #users_table th:nth-child(4) { width: 20%; }

.contents .user-management-page #users_table tbody td {
  padding: 0.7rem !important;
  overflow: hidden;
  text-overflow: ellipsis;
}

.user-management-page .user-identity {
  display: flex;
  align-items: center;
  min-width: 0;
  gap: 0.65rem;
}

.user-management-page .user-profile-link {
  display: block;
  color: inherit;
  text-decoration: none;
}

.contents .user-management-page #users_table tbody tr:has(a.user-profile-link) {
  cursor: pointer;
}

.user-management-page .user-profile-link:hover .user-identity-text strong,
.user-management-page .user-profile-link:focus .user-identity-text strong {
  color: #246E9F;
  text-decoration: underline;
}

.user-management-page .user-profile-link:focus-visible {
  border-radius: 10px;
  outline: 2px solid #4B93C5;
  outline-offset: 3px;
}

.user-management-page .user-avatar {
  display: inline-flex;
  flex: 0 0 2rem;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 10px;
  background: linear-gradient(145deg, #D9EDFA, #E6F6EE);
  color: #246E9F;
  font-size: 0.78rem;
  font-weight: 800;
}

.user-management-page .user-identity-admin .user-avatar {
  background: linear-gradient(145deg, #FFE5E2, #FFF2E8);
  color: #A5413B;
}

.user-management-page .user-identity-text {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 0.12rem;
}

.user-management-page .user-identity-text strong,
.user-management-page .user-identity-text small {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.user-management-page .user-identity-text strong {
  color: #17324D;
  font-size: 0.75rem;
}

.user-management-page .user-identity-admin .user-identity-text strong {
  color: #A5413B;
}

.user-management-page .user-identity-text small {
  color: #7890A3;
  font-size: 0.63rem;
}

.user-management-page .user-email-link {
  display: block;
  overflow: hidden;
  color: #366F98;
  font-size: 0.69rem;
  text-decoration: none;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.user-management-page .user-email-link:hover {
  color: #174F77;
  text-decoration: underline;
}

.user-management-page .user-empty-value,
.user-management-page .user-last-login {
  color: #7890A3;
  font-size: 0.66rem;
}

.user-management-page .user-role-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.25rem 0.5rem;
  border: 1px solid #C8E4D4;
  border-radius: 999px;
  background: #ECF8F1;
  color: #28704B;
  font-size: 0.61rem;
  font-weight: 760;
  white-space: nowrap;
}

.user-management-page .user-role-admin {
  border-color: #F0C6C2;
  background: #FFF0EF;
  color: #A5413B;
}

.user-management-page #users_table a.user-edit-link {
  gap: 0.25rem;
  min-height: 1.85rem;
  padding: 0.2rem 0.55rem;
}

.user-management-page #users_table a.user-edit-link svg {
  width: 0.85rem;
  height: 0.85rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.user-management-page .dataTables_empty {
  padding: 2rem !important;
  color: #698094 !important;
  text-align: center !important;
}

@media (max-width: 48rem) {
  .user-management-page .user-management-heading {
    padding-right: 0;
  }

  .user-management-page form#add_new_user {
    position: static;
    margin-top: 0.8rem;
  }

  .user-management-page .user-management-toolbar {
    grid-template-columns: minmax(0, 1fr);
  }

  .user-management-page .user-management-summary,
  .user-management-page .user-management-toolbar {
    padding-right: 0.85rem;
    padding-left: 0.85rem;
  }

  .contents .user-management-page #user_list.datatable_container {
    margin-right: 0.85rem;
    margin-left: 0.85rem;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .user-management-page .user-directory-heading {
    margin-right: 0.85rem;
    margin-left: 0.85rem;
  }

  .user-management-page #users_table,
  .user-management-page #users_table tbody,
  .user-management-page #users_table tr,
  .user-management-page #users_table td {
    display: block;
    width: 100% !important;
    box-sizing: border-box;
  }

  .user-management-page #users_table thead {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
  }

  .contents .user-management-page #users_table tbody tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.3rem 0.8rem;
    margin-bottom: 0.65rem;
    padding: 0.8rem;
    border: 1px solid #D8E5ED;
    border-radius: 13px;
    background: #FFFFFF !important;
    box-shadow: 0 5px 14px rgba(23, 50, 77, 0.06);
  }

  .contents .user-management-page #users_table tbody tr:hover {
    background: #F7FBFE !important;
    box-shadow: inset 3px 0 0 #5B9FCE, 0 5px 14px rgba(23, 50, 77, 0.07);
  }

  .contents .user-management-page #users_table tbody td {
    padding: 0 !important;
    border: 0 !important;
  }

  .contents .user-management-page #users_table tbody td:nth-child(1) {
    grid-column: 1;
    grid-row: 1 / span 2;
  }

  .contents .user-management-page #users_table tbody td:nth-child(2) {
    grid-column: 1 / -1;
    grid-row: 3;
    margin-top: 0.3rem;
    padding-top: 0.55rem !important;
    border-top: 1px solid #E4ECF2 !important;
  }

  .contents .user-management-page #users_table tbody td:nth-child(3) {
    grid-column: 2;
    grid-row: 1;
    text-align: right;
  }

  .contents .user-management-page #users_table tbody td:nth-child(4) {
    grid-column: 1;
    grid-row: 4;
  }

}

@media (max-width: 30rem) {
  .user-management-page .user-management-summary {
    grid-template-columns: 1fr;
  }

  .user-management-page .user-summary-card {
    min-height: 2.7rem;
  }

  .user-management-page .user-management-header {
    padding: 0.85rem;
  }
}

/* Sur ordinateur, l'annuaire présente deux utilisateurs par ligne. */
@media (min-width: 38rem) {
  .contents .user-management-page #user_list.datatable_container {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
  }

  .user-management-page #users_table,
  .user-management-page #users_table tbody {
    display: block;
    width: 100% !important;
    box-sizing: border-box;
  }

  .user-management-page #users_table thead {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
  }

  .user-management-page #users_table tbody {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.7rem;
  }

  .user-management-page #user_list.is-list-view #users_table tbody {
    grid-template-columns: minmax(0, 1fr);
  }

  .contents .user-management-page #users_table tbody tr {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-content: start;
    gap: 0.35rem 0.75rem;
    min-width: 0;
    box-sizing: border-box;
    padding: 0.8rem;
    border: 1px solid #D8E5ED;
    border-radius: 13px;
    background: #FFFFFF !important;
    box-shadow: 0 5px 14px rgba(23, 50, 77, 0.06);
  }

  .contents .user-management-page #users_table tbody tr:hover {
    background: #F7FBFE !important;
    box-shadow: inset 3px 0 0 #5B9FCE, 0 6px 16px rgba(23, 50, 77, 0.08);
  }

  .contents .user-management-page #users_table tbody td {
    width: auto !important;
    min-width: 0;
    padding: 0 !important;
    border: 0 !important;
    white-space: normal;
  }

  .contents .user-management-page #users_table tbody td:nth-child(1) {
    grid-column: 1;
    grid-row: 1 / span 2;
  }

  .contents .user-management-page #users_table tbody td:nth-child(2) {
    grid-column: 1 / -1;
    grid-row: 3;
    margin-top: 0.3rem;
    padding-top: 0.55rem !important;
    border-top: 1px solid #E4ECF2 !important;
  }

  .contents .user-management-page #users_table tbody td:nth-child(3) {
    grid-column: 2;
    grid-row: 1;
    text-align: right;
  }

  .contents .user-management-page #users_table tbody td:nth-child(4) {
    grid-column: 1 / -1;
    grid-row: 4;
  }
}

@media (max-width: 37.99rem) {
  .user-management-page .user-view-switch {
    display: none;
  }
}

/* Rapport des réservations : sous-blocs stables et empilés sur mobile. */
@media (max-width: 44rem) {
  form.standard#report_form {
    overflow: hidden;
  }

  form.standard#report_form > fieldset {
    display: flex !important;
    float: none !important;
    width: 100% !important;
    min-width: 0 !important;
    flex-direction: column;
    box-sizing: border-box !important;
  }

  form.standard#report_form > fieldset > fieldset {
    display: block !important;
    float: none !important;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    margin: 0 0 0.65rem !important;
    padding: 0.75rem !important;
    box-sizing: border-box !important;
    clear: both !important;
  }

  form.standard#report_form > fieldset > fieldset:last-child {
    margin-bottom: 0 !important;
  }

  form.standard#report_form fieldset fieldset > div,
  form.standard#report_form fieldset fieldset > div > label,
  form.standard#report_form fieldset fieldset > div > div {
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  form.standard#report_form input[type="text"],
  form.standard#report_form input[type="date"],
  form.standard#report_form select {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  form.standard#report_form .submit_buttons {
    width: 100% !important;
    margin-top: 0 !important;
    padding: 0.65rem 0 0 !important;
  }
}

/* Le rapport ne propose que les exports PDF et Excel. */
#report_output .dt-buttons .buttons-colvis,
#report_output .dt-buttons .buttons-copy,
#report_output .dt-buttons .buttons-csv,
#report_output .dt-buttons .buttons-print,
#div_summary .dt-buttons .buttons-colvis,
#div_summary .dt-buttons .buttons-copy,
#div_summary .dt-buttons .buttons-csv,
#div_summary .dt-buttons .buttons-print {
  display: none !important;
}

/* Mon profil : informations personnelles et sécurité du compte. */
.profile-page {
  width: calc(100% - 2rem);
  max-width: 46rem;
  margin: 1.25rem auto 2rem;
  padding: 0 0 1.2rem;
  box-sizing: border-box;
  overflow: hidden;
  border: 1px solid #D8E2EC;
  border-radius: 18px;
  background: #F8FAFC;
  color: #17324D;
  box-shadow: 0 16px 38px rgba(23, 50, 77, 0.1);
}

.profile-page .profile-header {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  padding: 1rem 1.15rem;
  border-bottom: 1px solid #D8E2EC;
  background: linear-gradient(125deg, #EAF5FF 0%, #F1EEFF 51%, #EAF9F1 100%);
}

.profile-page .profile-title-icon {
  display: inline-flex;
  flex: 0 0 2.15rem;
  align-items: center;
  justify-content: center;
  width: 2.15rem;
  height: 2.15rem;
  border: 1px solid rgba(60, 140, 204, 0.22);
  border-radius: 11px;
  background: rgba(255, 255, 255, 0.82);
  color: #2F78AD;
  box-shadow: 0 5px 13px rgba(47, 120, 173, 0.14);
}

.profile-page .profile-title-icon svg {
  width: 1.2rem;
  height: 1.2rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.profile-page .profile-header h2 {
  margin: 0;
  color: #17324D;
  font-size: 1.08rem;
  font-weight: 780;
  line-height: 1.25;
}

.profile-page .profile-header p {
  margin: 0.25rem 0 0;
  color: #587085;
  font-size: 0.72rem;
  line-height: 1.45;
}

.profile-page form.standard#profile_form {
  float: none !important;
  width: auto !important;
  max-width: none !important;
  margin: 1rem 1.15rem 0 !important;
  padding: 0 !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.profile-page form#profile_form > fieldset {
  float: none !important;
  width: 100% !important;
  margin: 0 0 0.75rem !important;
  padding: 0.9rem !important;
  box-sizing: border-box !important;
  border: 1px solid #E0EAF1 !important;
  border-radius: 11px !important;
  background: rgba(255, 255, 255, 0.78) !important;
  box-shadow: 0 3px 10px rgba(23, 50, 77, 0.045) !important;
}

.profile-page form#profile_form > fieldset > legend {
  width: fit-content !important;
  max-width: 100% !important;
  margin: 0 0 0.65rem !important;
  padding: 0.25rem 0.55rem !important;
  border: 1px solid #D9E8F0 !important;
  border-radius: 8px !important;
  background: linear-gradient(135deg, #F0F7FC 0%, #F2FAF6 100%) !important;
  color: #294862 !important;
  font-size: 0.78rem !important;
  font-style: normal !important;
  font-weight: 750 !important;
}

.profile-page form#profile_form > fieldset > div {
  display: grid;
  grid-template-columns: minmax(9rem, 0.42fr) minmax(0, 0.58fr);
  align-items: center;
  gap: 0.6rem;
  width: 100%;
  margin: 0 0 0.6rem;
  box-sizing: border-box;
}

.profile-page form#profile_form > fieldset > div:last-child {
  margin-bottom: 0;
}

.profile-page form#profile_form label {
  width: auto !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  text-align: left !important;
}

.profile-page form#profile_form input[type="text"],
.profile-page form#profile_form input[type="email"],
.profile-page form#profile_form input[type="password"] {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  overflow: hidden;
  text-overflow: ellipsis;
}

.profile-page form#profile_form .profile-password-field > label {
  grid-column: 1;
  grid-row: 1;
}

.profile-page form#profile_form .profile-password-field > input {
  grid-column: 2;
  grid-row: 1;
  padding-right: 3rem !important;
}

.profile-page form#profile_form .profile-password-field > div.eye {
  display: flex;
  grid-column: 2;
  grid-row: 1;
  align-self: center;
  justify-self: end;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  margin: 0 0.1rem 0 0;
  z-index: 2;
  color: #294862;
  pointer-events: none;
}

.profile-page form#profile_form .profile-password-field > div.eye svg {
  position: static;
  width: 2.35rem;
  height: 2.35rem;
  margin: 0;
  padding: 0.5rem;
  box-sizing: border-box;
  cursor: pointer;
  pointer-events: auto;
  touch-action: manipulation;
}

.profile-page form#profile_form .profile-password-field > div.eye svg:hover {
  color: #137A55;
}

.profile-page form#profile_form input:disabled {
  border-color: #E0E6EB !important;
  background: #F1F4F6 !important;
  color: #738596 !important;
  cursor: not-allowed;
}

.profile-page .profile-password-note {
  display: block !important;
  grid-template-columns: none !important;
  margin: 0 0 0.75rem !important;
  padding: 0.55rem 0.65rem;
  border: 1px solid #D4E5EF;
  border-radius: 9px;
  background: #F2F8FC;
  color: #567086;
  font-size: 0.7rem;
  line-height: 1.45;
}

.profile-page form#profile_form .profile-notification-field {
  grid-template-columns: minmax(0, 1fr) auto !important;
  min-height: 3rem;
  margin: 0 !important;
  padding: 0.65rem 0.75rem;
  border: 1px solid #D6E8E1;
  border-radius: 10px;
  background: #FBFEFC;
}

.profile-page form#profile_form .profile-notification-field label {
  color: #244C40;
  font-size: 0.78rem;
  font-weight: 700;
  line-height: 1.35;
}

.profile-page form#profile_form .profile-notification-field input[type="checkbox"] {
  width: 1.3rem !important;
  height: 1.3rem !important;
  margin: 0 !important;
  accent-color: #249373;
  cursor: pointer;
}

.profile-page form#profile_form > fieldset.profile-actions {
  display: flex !important;
  align-items: center;
  justify-content: flex-end;
  gap: 0.55rem;
  margin: 0 !important;
  padding: 0.9rem 0 0 !important;
  border: 0 !important;
  border-top: 1px solid #DFE7EF !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
}

.profile-page .profile-back-button,
.profile-page .profile-save-button {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: auto !important;
  min-width: 0 !important;
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  max-height: 1.75rem !important;
  box-sizing: border-box !important;
  margin: 0 !important;
  padding: 2px 0.8rem !important;
  border: 0 !important;
  border-radius: 20px !important;
  background: #F3F4F6 !important;
  color: #1F2937 !important;
  box-shadow: 0 7px 16px rgba(107, 114, 128, 0.36) !important;
  font-size: 0.82rem !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  cursor: pointer;
}

.profile-page .profile-back-button:hover,
.profile-page .profile-back-button:focus,
.profile-page .profile-save-button:hover,
.profile-page .profile-save-button:focus {
  background: #E5E7EB !important;
  color: #1F2937 !important;
  box-shadow: 0 9px 20px rgba(107, 114, 128, 0.45) !important;
}

.profile-page .profile-message {
  margin: 1rem 1.15rem 0;
  padding: 0.65rem 0.75rem;
  border-radius: 10px;
  font-size: 0.73rem;
  line-height: 1.45;
}

.profile-page .profile-success {
  border: 1px solid #B9DEC9;
  background: #ECF9F2;
  color: #256747;
}

.profile-page .profile-errors {
  border: 1px solid #F1B9B6;
  border-left: 4px solid #C95B52;
  background: #FFF3F2;
  color: #8D342F;
}

.profile-page .profile-errors ul {
  margin: 0.4rem 0 0;
  padding-left: 1.1rem;
}

.banner nav.user-nav details.user-account-menu .settings-submenu-profile::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='8' r='3' fill='none' stroke='%231F2937' stroke-width='2'/%3E%3Cpath fill='none' stroke='%231F2937' stroke-width='2' d='M5 20c.7-3.4 3.1-5 7-5s6.3 1.6 7 5M18 5v5m-2.5-2.5h5'/%3E%3C/svg%3E");
}

@media (max-width: 44rem) {
  .profile-page {
    width: calc(100% - 0.75rem);
    margin-top: 0.75rem;
    padding-bottom: 0.85rem;
    border-radius: 14px;
    overflow-wrap: anywhere;
  }

  .profile-page .profile-header {
    gap: 0.6rem;
    padding: 0.85rem;
  }

  .profile-page .profile-header > div {
    min-width: 0;
  }

  .profile-page .profile-header h2 {
    font-size: 1rem;
  }

  .profile-page .profile-header p {
    font-size: 0.7rem;
  }

  .profile-page form.standard#profile_form {
    width: auto !important;
    margin: 0.75rem 0.7rem 0 !important;
    overflow: visible;
  }

  .profile-page form#profile_form > fieldset {
    min-width: 0 !important;
    padding: 0.72rem !important;
  }

  .profile-page form#profile_form > fieldset > legend {
    max-width: calc(100% - 0.4rem) !important;
    white-space: normal !important;
  }

  .profile-page form#profile_form > fieldset > div {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.3rem;
    min-width: 0;
  }

  .profile-page form#profile_form label {
    width: 100% !important;
    min-width: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    text-align: left !important;
    overflow-wrap: anywhere;
  }

  .profile-page form#profile_form input[type="text"],
  .profile-page form#profile_form input[type="email"],
  .profile-page form#profile_form input[type="password"] {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    min-height: 2.5rem !important;
    margin: 0 !important;
    padding: 0.55rem 0.65rem !important;
    box-sizing: border-box !important;
    font-size: 1rem !important;
  }

  .profile-page form#profile_form .profile-password-field > label {
    grid-column: 1;
    grid-row: 1;
  }

  .profile-page form#profile_form .profile-password-field > input {
    grid-column: 1;
    grid-row: 2;
    padding-right: 3.2rem !important;
  }

  .profile-page form#profile_form .profile-password-field > div.eye {
    grid-column: 1;
    grid-row: 2;
    width: 2.75rem;
    height: 2.5rem;
    margin-right: 0.05rem;
  }

  .profile-page form#profile_form .profile-password-field > div.eye svg {
    width: 2.6rem;
    height: 2.5rem;
    padding: 0.55rem;
  }

  .profile-page form#profile_form > fieldset.profile-actions {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem;
    width: 100% !important;
  }

  .profile-page .profile-back-button,
  .profile-page .profile-save-button {
    width: 100% !important;
    min-height: 2.5rem !important;
    max-height: none !important;
    padding: 0.5rem 0.7rem !important;
    font-size: 0.85rem !important;
  }

  .profile-page .profile-message {
    margin-right: 0.7rem;
    margin-left: 0.7rem;
  }
}

@media (max-width: 22rem) {
  .profile-page {
    width: calc(100% - 0.4rem);
  }

  .profile-page .profile-title-icon {
    flex-basis: 1.9rem;
    width: 1.9rem;
    height: 1.9rem;
  }

  .profile-page form#profile_form > fieldset.profile-actions {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Guide utilisateur du système : parcours courts, lisibles et orientés actions. */
.user-guide-page {
  width: calc(100% - 2rem);
  max-width: 64rem;
  margin: 1.5rem auto 2rem;
  color: #17324D;
}

.user-guide-header {
  display: flex;
  align-items: flex-start;
  gap: 0.9rem;
  padding: 1.15rem 1.25rem;
  border: 1px solid #D4E4EF;
  border-radius: 18px;
  background: linear-gradient(125deg, #EAF5FF 0%, #F4F1FF 52%, #EAF9F1 100%);
  box-shadow: 0 12px 28px rgba(23, 50, 77, 0.1);
}

.user-guide-header-icon {
  display: inline-flex;
  flex: 0 0 2.7rem;
  align-items: center;
  justify-content: center;
  width: 2.7rem;
  height: 2.7rem;
  border: 1px solid #C9DEEC;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.86);
  color: #2F78AD;
}

.user-guide-header-icon svg {
  width: 1.55rem;
  height: 1.55rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.user-guide-kicker {
  display: block;
  margin-bottom: 0.18rem;
  color: #397FB3;
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.11em;
  text-transform: uppercase;
}

.user-guide-header h1 {
  margin: 0;
  color: #17324D;
  font-size: 1.25rem;
  line-height: 1.3;
}

.user-guide-header p {
  max-width: 48rem;
  margin: 0.35rem 0 0;
  color: #5B7084;
  font-size: 0.82rem;
  line-height: 1.5;
}

.user-guide-page:not(.admin-guide-page) .user-guide-header > div {
  min-width: 0;
  flex: 1 1 auto;
}

.user-guide-page:not(.admin-guide-page) .user-guide-back {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  min-height: 1.85rem;
  margin-left: auto;
  padding: 0.25rem 0.75rem;
  box-sizing: border-box;
  border: 1px solid #C9DEEC;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.86);
  color: #246E9F !important;
  box-shadow: 0 4px 10px rgba(47, 120, 173, 0.1);
  font-size: 0.7rem;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
}

.user-guide-page:not(.admin-guide-page) .user-guide-back:hover,
.user-guide-page:not(.admin-guide-page) .user-guide-back:focus {
  border-color: #9FC4DC;
  background: #FFFFFF;
  color: #1D5D86 !important;
}

.user-guide-page:not(.admin-guide-page) .user-guide-back span {
  font-size: 0.9rem;
}

.user-guide-account-menu-tip {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  margin: 0.85rem 0;
  padding: 0.85rem 1rem;
  border: 1px solid #A9D9C3;
  border-left: 5px solid #249373;
  border-radius: 12px;
  background: linear-gradient(110deg, #E9F9F2 0%, #F2FAFF 55%, #F6F2FF 100%);
  color: #294862;
  box-shadow: 0 7px 18px rgba(36, 147, 115, 0.1);
}

.user-guide-account-menu-icon {
  display: inline-flex;
  flex: 0 0 2.35rem;
  align-items: center;
  justify-content: center;
  width: 2.35rem;
  height: 2.35rem;
  border-radius: 50%;
  background: #249373;
  color: #FFFFFF;
  box-shadow: 0 4px 10px rgba(36, 147, 115, 0.22);
}

.user-guide-account-menu-icon svg {
  width: 1.35rem;
  height: 1.35rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.user-guide-account-menu-tip strong {
  display: block;
  color: #176B58;
  font-size: 0.82rem;
}

.user-guide-account-menu-tip p {
  margin: 0.22rem 0 0;
  color: #4E687B;
  font-size: 0.76rem;
  line-height: 1.45;
}

.user-guide-quick-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 0.65rem;
  margin: 0 0 0.85rem;
}

.user-guide-quick-actions a {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  min-height: 2.6rem;
  padding: 0.45rem 0.7rem;
  box-sizing: border-box;
  border: 1px solid #D6E4ED;
  border-radius: 11px;
  background: #FFFFFF;
  color: #294862 !important;
  box-shadow: 0 4px 12px rgba(23, 50, 77, 0.06);
  font-size: 0.76rem;
  font-weight: 700;
  text-align: center;
  text-decoration: none;
}

.user-guide-quick-actions a:hover,
.user-guide-quick-actions a:focus {
  border-color: #AFCFE3;
  background: #F2F8FC;
}

.user-guide-quick-actions a > span {
  color: #3C8CCC;
  font-size: 1rem;
  line-height: 1;
}

.user-guide-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.85rem;
}

.user-guide-card {
  display: flex;
  min-width: 0;
  padding: 1rem;
  box-sizing: border-box;
  flex-direction: column;
  border: 1px solid #DCE6EF;
  border-radius: 14px;
  background: #FFFFFF;
  box-shadow: 0 7px 18px rgba(23, 50, 77, 0.065);
}

.user-guide-card > header {
  display: grid;
  grid-template-columns: 2rem minmax(0, 1fr);
  align-items: start;
  gap: 0.65rem;
  padding-bottom: 0.7rem;
  border-bottom: 1px solid #E2EAF0;
}

.user-guide-number {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 9px;
  background: #E7F2FA;
  color: #2F78AD;
  font-size: 0.68rem;
  font-weight: 800;
}

.user-guide-booking .user-guide-number,
.user-guide-account .user-guide-number {
  background: #E6F5EF;
  color: #18746E;
}

.user-guide-manage .user-guide-number {
  background: #F1EDFD;
  color: #6246A8;
}

.user-guide-quota .user-guide-number {
  background: #FFF2E3;
  color: #A65C13;
}

.user-guide-colors .user-guide-number {
  background: #EEF3FF;
  color: #5369B7;
}

.user-guide-card h2,
.user-guide-card h3 {
  margin: 0;
  color: #17324D;
}

.user-guide-card h2 {
  font-size: 0.9rem;
}

.user-guide-title-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.45rem;
}

.user-guide-feature-status {
  display: inline-flex;
  align-items: center;
  min-height: 1.25rem;
  padding: 0.08rem 0.42rem;
  box-sizing: border-box;
  border-radius: 999px;
  font-size: 0.6rem;
  font-weight: 800;
  line-height: 1;
  text-transform: uppercase;
}

.user-guide-feature-status.is-enabled {
  border: 1px solid #B9DEC9;
  background: #EAF8F0;
  color: #18704C;
}

.user-guide-feature-status.is-disabled {
  border: 1px solid #D4DCE4;
  background: #F1F4F6;
  color: #64748B;
}

.user-guide-card h3 {
  font-size: 0.82rem;
}

.user-guide-card header p {
  margin: 0.28rem 0 0;
  color: #64788B;
  font-size: 0.72rem;
  line-height: 1.45;
}

.user-guide-card ol {
  display: grid;
  gap: 0.48rem;
  margin: 0.8rem 0;
  padding: 0;
  list-style: none;
  counter-reset: guide-step;
}

.user-guide-card li {
  position: relative;
  padding-left: 1.8rem;
  color: #52667A;
  font-size: 0.74rem;
  line-height: 1.45;
  counter-increment: guide-step;
}

.user-guide-card li::before {
  content: counter(guide-step);
  position: absolute;
  top: 0.02rem;
  left: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 50%;
  background: #EEF5FA;
  color: #2F78AD;
  font-size: 0.62rem;
  font-weight: 800;
}

.user-guide-action {
  display: inline-flex;
  align-items: center;
  align-self: flex-start;
  justify-content: center;
  gap: 0.4rem;
  min-height: 1.8rem;
  margin-top: auto;
  padding: 0.25rem 0.72rem;
  box-sizing: border-box;
  border: 1px solid #C8DDEB;
  border-radius: 999px;
  background: #F2F8FC;
  color: #246E9F !important;
  font-size: 0.7rem;
  font-weight: 700;
  text-decoration: none;
}

.user-guide-action:hover,
.user-guide-action:focus {
  border-color: #9FC4DC;
  background: #E4F1F8;
}

.user-guide-action span {
  font-size: 0.85rem;
}

.user-guide-account {
  grid-column: 1 / -1;
}

.user-guide-account-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.75rem;
  margin-top: 0.8rem;
}

.user-guide-account-grid article {
  display: flex;
  min-width: 0;
  padding: 0.85rem;
  flex-direction: column;
  border: 1px solid #DFE8EF;
  border-radius: 12px;
  background: #F9FBFD;
}

.user-guide-account-icon {
  display: block;
  width: 1.55rem;
  height: 1.55rem;
  margin-bottom: 0.45rem;
  border-radius: 8px;
  background-color: #E7F2FA;
  background-position: center;
  background-repeat: no-repeat;
  background-size: 0.95rem;
}

.user-guide-email-icon {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 6h18v12H3zM3 7l9 7 9-7' fill='none' stroke='%232F78AD' stroke-width='1.8' stroke-linejoin='round'/%3E%3C/svg%3E");
}

.user-guide-password-icon {
  background-color: #E6F5EF;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='5' y='10' width='14' height='10' rx='2' fill='none' stroke='%2318746E' stroke-width='1.8'/%3E%3Cpath d='M8 10V7a4 4 0 0 1 8 0v3M12 14v2' fill='none' stroke='%2318746E' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E");
}

.user-guide-tip {
  display: flex;
  align-items: flex-start;
  gap: 0.65rem;
  margin-top: 0.85rem;
  padding: 0.75rem 0.9rem;
  border: 1px solid #C9DEEC;
  border-left: 4px solid #3C8CCC;
  border-radius: 10px;
  background: #F1F8FC;
  color: #52667A;
}

.user-guide-tip > span {
  display: inline-flex;
  flex: 0 0 1.45rem;
  align-items: center;
  justify-content: center;
  width: 1.45rem;
  height: 1.45rem;
  border-radius: 50%;
  background: #3C8CCC;
  color: #FFFFFF;
  font-size: 0.72rem;
  font-weight: 800;
}

.user-guide-tip strong {
  color: #294862;
  font-size: 0.76rem;
}

.user-guide-tip p {
  margin: 0.2rem 0 0;
  font-size: 0.72rem;
  line-height: 1.45;
}

@media (max-width: 44rem) {
  .user-guide-page {
    width: calc(100% - 0.75rem);
    margin-top: 0.75rem;
  }

  .user-guide-header {
    padding: 0.9rem;
    border-radius: 14px;
  }

  .user-guide-account-menu-tip {
    align-items: flex-start;
    padding: 0.75rem 0.8rem;
  }

  .user-guide-page:not(.admin-guide-page) .user-guide-header {
    flex-wrap: wrap;
  }

  .user-guide-page:not(.admin-guide-page) .user-guide-header > div {
    flex: 1 1 calc(100% - 3.6rem);
  }

  .user-guide-page:not(.admin-guide-page) .user-guide-back {
    width: 100%;
    min-height: 2.35rem;
    margin: 0.25rem 0 0;
  }

  .user-guide-header h1 {
    font-size: 1.05rem;
  }

  .user-guide-quick-actions,
  .user-guide-grid,
  .user-guide-account-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .user-guide-quick-actions {
    gap: 0.45rem;
  }

  .user-guide-account {
    grid-column: auto;
  }

  .user-guide-card {
    padding: 0.82rem;
  }
}

/* Aide réservée aux administrateurs. */
.admin-guide-page .admin-guide-header {
  border-color: #E4D6E8;
  background: linear-gradient(125deg, #F8EEEE 0%, #F2EFFF 52%, #EEF5FA 100%);
}

.admin-guide-page .admin-guide-header-icon {
  border-color: #DBCFEA;
  color: #6246A8;
}

.admin-guide-page .user-guide-kicker {
  color: #A33A35;
}

.admin-guide-page .admin-guide-header > div {
  min-width: 0;
  flex: 1 1 auto;
}

.admin-guide-page .admin-guide-back {
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: center;
  gap: 0.4rem;
  min-height: 1.85rem;
  margin-left: auto;
  padding: 0.25rem 0.75rem;
  box-sizing: border-box;
  border: 1px solid #D5C9E8;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.86);
  color: #6246A8 !important;
  box-shadow: 0 4px 10px rgba(98, 70, 168, 0.1);
  font-size: 0.7rem;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  white-space: nowrap;
}

.admin-guide-page .admin-guide-back:hover,
.admin-guide-page .admin-guide-back:focus {
  border-color: #BAAAD7;
  background: #FFFFFF;
  color: #4F378A !important;
}

.admin-guide-page .admin-guide-back span {
  font-size: 0.9rem;
}

.admin-guide-page .admin-guide-quick-actions a {
  border-color: #E8D3D1;
  background: #FFF7F6;
  color: #8D342F !important;
}

.admin-guide-page .admin-guide-quick-actions a:hover,
.admin-guide-page .admin-guide-quick-actions a:focus {
  border-color: #D9AEAA;
  background: #FDE9E7;
}

.admin-guide-page .admin-guide-quick-actions a > span {
  color: #A33A35;
}

.admin-guide-page .admin-guide-card .user-guide-action {
  border-color: #E4C6C3;
  background: #FFF4F3;
  color: #8D342F !important;
}

.admin-guide-page .admin-guide-card .user-guide-action:hover,
.admin-guide-page .admin-guide-card .user-guide-action:focus {
  border-color: #D6A6A2;
  background: #FDE5E3;
}

.admin-guide-page .user-guide-admin-practices {
  grid-column: 1 / -1;
}

.admin-guide-page .user-guide-admin-practices .user-guide-number {
  background: #FDE8E6;
  color: #A33A35;
}

.admin-guide-page .admin-guide-tip {
  border-color: #E7C6C3;
  border-left-color: #C95B52;
  background: #FFF5F4;
}

.admin-guide-page .admin-guide-tip > span {
  background: #C95B52;
}

.admin-guide-page .admin-guide-tip strong {
  color: #8D342F;
}

.quota-increase-request-form {
  margin: 0.8rem 0 0;
}

button.quota-increase-request-button,
input.quota-increase-request-button,
.edit_entry form#main button.quota-increase-request-button {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-height: 2.35rem !important;
  margin: 0.75rem 0 0 !important;
  padding: 0.42rem 1rem 0.42rem 2.45rem !important;
  border: 1px solid #C6DEE8 !important;
  border-radius: 999px !important;
  background-color: #F2F8FC !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 6h16v12H4zM4 7l8 6 8-6' fill='none' stroke='%23249373' stroke-width='1.8' stroke-linejoin='round'/%3E%3C/svg%3E"), linear-gradient(120deg, #EAF4FC 0%, #FFFFFF 48%, #E7FAF3 100%) !important;
  background-position: 0.82rem center, 0 0 !important;
  background-repeat: no-repeat, no-repeat !important;
  background-size: 1.1rem, 100% 100% !important;
  color: #1B4A62 !important;
  -webkit-text-fill-color: #1B4A62 !important;
  box-shadow: 0 5px 14px rgba(47, 120, 173, 0.13), inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
  font-size: 0.78rem !important;
  font-weight: 750 !important;
  line-height: 1.2 !important;
  cursor: pointer;
  transition: transform 0.16s ease, border-color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease !important;
}

button.quota-increase-request-button:hover,
button.quota-increase-request-button:focus,
input.quota-increase-request-button:hover,
input.quota-increase-request-button:focus,
.edit_entry form#main button.quota-increase-request-button:hover,
.edit_entry form#main button.quota-increase-request-button:focus {
  border-color: #9DC9C0 !important;
  background-color: #E9F8F3 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 6h16v12H4zM4 7l8 6 8-6' fill='none' stroke='%23176B58' stroke-width='1.8' stroke-linejoin='round'/%3E%3C/svg%3E"), linear-gradient(120deg, #DDEFFA 0%, #F7FCFA 48%, #DDF4ED 100%) !important;
  color: #176B58 !important;
  -webkit-text-fill-color: #176B58 !important;
  box-shadow: 0 7px 17px rgba(36, 147, 115, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
  transform: translateY(-1px);
}

.quota-request-page {
  width: calc(100% - 2rem);
  max-width: 38rem;
  margin: 2rem auto;
}

.quota-request-card {
  padding: 1.35rem;
  box-sizing: border-box;
  border: 1px solid #D8E2EC;
  border-radius: 18px;
  background: #FFFFFF;
  color: #17324D;
  box-shadow: 0 14px 32px rgba(23, 50, 77, 0.11);
  text-align: center;
}

.quota-request-card.is-success {
  border-color: #C4E1D1;
  background: linear-gradient(135deg, #FFFFFF 0%, #EFFAF4 100%);
}

.quota-request-card.is-warning {
  border-color: #E8D8B8;
  background: linear-gradient(135deg, #FFFFFF 0%, #FFF9ED 100%);
}

.quota-request-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.8rem;
  height: 2.8rem;
  margin-bottom: 0.7rem;
  border-radius: 50%;
  background: #2F9366;
  color: #FFFFFF;
  font-size: 1.15rem;
  font-weight: 800;
}

.quota-request-card.is-warning .quota-request-icon {
  background: #C17A22;
}

.quota-request-card h1 {
  margin: 0;
  color: #17324D;
  font-size: 1.05rem;
}

.quota-request-card p {
  max-width: 31rem;
  margin: 0.5rem auto 0;
  color: #5B7084;
  font-size: 0.78rem;
  line-height: 1.55;
}

.quota-request-actions {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0.55rem;
  margin-top: 1rem;
  padding-top: 0.9rem;
  border-top: 1px solid #E1E9EF;
}

.quota-request-actions a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 1.85rem;
  padding: 0.25rem 0.8rem;
  box-sizing: border-box;
  border: 1px solid #C9DAE7;
  border-radius: 999px;
  background: #F3F8FB;
  color: #294862 !important;
  font-size: 0.72rem;
  font-weight: 700;
  text-decoration: none;
}

.quota-request-actions a:hover,
.quota-request-actions a:focus {
  border-color: #AFC9DB;
  background: #E8F2F8;
}

/* Confirmation commune affichée après une sauvegarde utilisateur ou admin. */
.save-confirmation-card {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  margin: 0 0 1rem;
  padding: 0.85rem 1rem;
  box-sizing: border-box;
  border: 1px solid #C4E1D1;
  border-radius: 14px;
  background: linear-gradient(135deg, #FFFFFF 0%, #EFFAF4 100%);
  color: #17324D;
  box-shadow: 0 9px 22px rgba(23, 50, 77, 0.08);
}

.save-confirmation-icon {
  display: inline-flex;
  flex: 0 0 2.25rem;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 50%;
  background: #2F9366;
  color: #FFFFFF;
  font-size: 1rem;
  font-weight: 800;
}

.save-confirmation-card h2 {
  margin: 0;
  color: #17324D;
  font-size: 0.84rem;
  line-height: 1.3;
}

.save-confirmation-card p {
  margin: 0.2rem 0 0;
  color: #5B7084;
  font-size: 0.74rem;
  line-height: 1.45;
}

.profile-page > .save-confirmation-card {
  margin: 1rem 1.15rem 0;
}

.profile-page .profile-calendar-color {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin: 0.9rem 1.15rem 0;
  padding: 0.7rem 0.85rem;
  box-sizing: border-box;
  border: 1px solid var(--booking-user-border);
  border-radius: 11px;
  background: var(--booking-user-bg);
  color: var(--booking-user-text);
  box-shadow: 0 5px 14px color-mix(in srgb, var(--booking-user-border) 20%, transparent);
}

.profile-page .profile-calendar-color-swatch {
  display: inline-block;
  flex: 0 0 3rem;
  width: 3rem;
  height: 2.1rem;
  box-sizing: border-box;
  border: 1px solid var(--booking-user-border);
  border-left: 4px solid var(--booking-user-border);
  border-radius: 8px;
  background: var(--booking-user-bg);
  box-shadow: 0 2px 7px color-mix(in srgb, var(--booking-user-border) 22%, transparent);
}

.profile-page .profile-calendar-color h2 {
  margin: 0;
  color: var(--booking-user-text);
  font-size: 0.8rem;
}

.profile-page .profile-calendar-color p {
  margin: 0.16rem 0 0;
  color: var(--booking-user-text);
  font-size: 0.7rem;
  line-height: 1.4;
}

@media (max-width: 44rem) {
  .save-confirmation-card {
    align-items: flex-start;
    margin-bottom: 0.75rem;
    padding: 0.75rem 0.8rem;
    border-radius: 12px;
  }
}

@media (max-width: 44rem) {
  .admin-guide-page .admin-guide-header {
    flex-wrap: wrap;
  }

  .admin-guide-page .admin-guide-header > div {
    flex: 1 1 calc(100% - 3.6rem);
  }

  .admin-guide-page .admin-guide-back {
    width: 100%;
    min-height: 2.35rem;
    margin: 0.25rem 0 0;
  }

  .admin-guide-page .user-guide-admin-practices {
    grid-column: auto;
  }

  .quota-request-page {
    width: calc(100% - 0.75rem);
    margin-top: 0.75rem;
  }

  .quota-request-card {
    padding: 1rem 0.8rem;
    border-radius: 14px;
  }

  .quota-request-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
  }

  .quota-request-actions a {
    min-height: 2.4rem;
  }
}

/* Calendrier EspaceSt : grille claire, élégante et adaptée au tactile. */
body.index > .contents {
  width: min(100%, 92rem);
  margin: 0 auto;
  padding: 0.4rem 1rem 1.5rem;
  box-sizing: border-box;
}

body.index .view_container {
  padding: 1rem;
  border: 1px solid #D8E7EF;
  border-radius: 22px;
  background: linear-gradient(145deg, #FFFFFF 0%, #FBFDFF 50%, #FBFEFC 100%);
  box-shadow: 0 18px 42px rgba(23, 50, 77, 0.1);
}

body.index .date_heading {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 2.9rem;
}

body.index .date_heading::before {
  content: "";
  position: absolute;
  left: 50%;
  width: 15rem;
  max-width: 75%;
  height: 3rem;
  border-radius: 50%;
  background: radial-gradient(ellipse, rgba(68, 188, 180, 0.08) 0%, rgba(60, 140, 204, 0.04) 46%, transparent 72%);
  transform: translateX(-50%);
  pointer-events: none;
}

body.index h2.date {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: auto;
  min-width: 0;
  margin: 0;
  padding: 0.46rem 1rem 0.51rem 2.55rem;
  border: 1px solid #C6DEE8;
  border-radius: 13px;
  background: linear-gradient(120deg, #F2F8FC 0%, #FFFFFF 48%, #F2FAF7 100%);
  color: #1B4A62;
  box-shadow: 0 5px 14px rgba(47, 120, 173, 0.11), inset 0 1px 0 rgba(255, 255, 255, 0.95);
  font-size: clamp(1.02rem, 1.8vw, 1.28rem);
  font-weight: 750;
  letter-spacing: 0.018em;
  line-height: 1.3;
  text-align: center;
  text-shadow: 0 1px 0 #FFFFFF;
  text-transform: capitalize;
}

body.index h2.date::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0.85rem;
  width: 1.15rem;
  height: 1.15rem;
  transform: translateY(-50%);
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='5' width='18' height='16' rx='3' fill='none' stroke='%23249373' stroke-width='1.8'/%3E%3Cpath d='M7 3v4m10-4v4M3 10h18' fill='none' stroke='%23249373' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
}

body.index h2.date::after {
  content: "";
  position: absolute;
  bottom: 0.2rem;
  left: 50%;
  width: 2.5rem;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, #3C8CCC, #44BCB4);
  transform: translateX(-50%);
}

body.index nav.main_calendar {
  min-height: 2.65rem;
  margin: 0.7rem 0;
}

body.index nav.main_calendar > nav.arrow {
  justify-content: center;
}

body.index nav.arrow {
  display: flex;
  align-items: center;
  gap: 0.45rem !important;
}

body.index nav.arrow a {
  min-width: 2.25rem;
  min-height: 2.25rem !important;
  padding: 0.35rem 0.85rem !important;
  border: 1px solid #D6E4ED !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.94) !important;
  color: #294862 !important;
  box-shadow: 0 5px 13px rgba(23, 50, 77, 0.08) !important;
  font-size: 0.75rem;
  transition: transform 0.16s ease, border-color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease;
}

body.index nav.arrow a.prev,
body.index nav.arrow a.next {
  width: 2.25rem;
  padding: 0 !important;
  color: #2F78AD !important;
  font-size: 1rem;
}

body.index nav.arrow a:hover,
body.index nav.arrow a:focus {
  border-color: #9DC9C0 !important;
  background: #E9F8F3 !important;
  color: #176B58 !important;
  box-shadow: 0 7px 16px rgba(36, 147, 115, 0.16) !important;
  transform: translateY(-1px);
}

body.index .table_container {
  max-height: calc(100vh - 15rem);
  min-height: 16rem;
  margin: 0.35rem 0 0;
  border: 1px solid #D6E3EB;
  border-radius: 16px;
  background: #FFFFFF;
  box-shadow: 0 12px 28px rgba(23, 50, 77, 0.09);
  scrollbar-color: #A9C9D9 #EEF5F8;
  scrollbar-width: thin;
}

body.index .table_container::-webkit-scrollbar {
  width: 9px;
  height: 9px;
}

body.index .table_container::-webkit-scrollbar-track {
  background: #EEF5F8;
}

body.index .table_container::-webkit-scrollbar-thumb {
  border: 2px solid #EEF5F8;
  border-radius: 999px;
  background: #A9C9D9;
}

body.index table.dwm_main {
  float: none;
  height: auto;
  margin: 0;
  border: 0;
  border-radius: 0;
  background: #FFFFFF;
}

body.index .dwm_main th,
body.index .dwm_main td {
  border-color: #E3EBF0;
}

body.index .dwm_main thead th {
  height: 2.65rem;
  padding: 0.35rem 0.5rem;
  border-bottom: 1px solid #D4E3EB;
  background: linear-gradient(180deg, #F8FCFE 0%, #EDF6FA 100%);
  color: #456177;
  box-shadow: 0 3px 8px rgba(23, 50, 77, 0.04);
  font-size: 0.68rem;
  font-weight: 800;
  letter-spacing: 0.07em;
  line-height: 1.2;
  text-transform: uppercase;
}

body.index .dwm_main thead th.weekend {
  background: linear-gradient(180deg, #FAF8FE 0%, #F1EDF9 100%);
  color: #695C84;
}

body.index .dwm_main:not(#month_main) thead th.today {
  background: linear-gradient(180deg, #E9F8F3 0%, #DDF2EB 100%);
  color: #176B58;
  box-shadow: inset 0 -3px #35A27E;
}

body.index .dwm_main:not(#month_main) thead th.today a {
  color: #176B58;
  font-weight: 800;
}

body.index #month_main td {
  background: #FFFFFF;
  transition: background-color 0.16s ease, box-shadow 0.16s ease;
}

body.index #month_main td.weekend {
  background: #FCFAFE;
}

body.index #month_main td.invalid {
  background-color: #F3F6F8;
  background-image: linear-gradient(135deg, rgba(202, 216, 225, 0.2) 25%, transparent 25%, transparent 50%, rgba(202, 216, 225, 0.2) 50%, rgba(202, 216, 225, 0.2) 75%, transparent 75%, transparent);
  background-size: 12px 12px;
}

body.index #month_main td:not(.invalid):hover {
  background: #F3FBF8;
  box-shadow: inset 0 0 0 2px rgba(36, 147, 115, 0.2);
}

body.index #month_main td.today {
  background: linear-gradient(145deg, #F1FBF7 0%, #F4FAFF 100%);
  box-shadow: inset 0 0 0 2px rgba(36, 147, 115, 0.38);
}

body.index #month_main td.past {
  background: #F1F3F5;
}

body.index #month_main td.past a.monthday {
  color: #929BA4;
}

body.index #month_main div.cell_container {
  min-height: 112px;
}

body.index #month_main div.cell_header {
  min-height: 2rem;
  height: 2rem;
  max-height: 2rem;
  overflow: visible;
}

body.index #month_main div.cell_header a.monthday {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.7rem;
  height: 1.7rem;
  min-height: 1.7rem;
  margin: 0.25rem 0 0 0.35rem;
  padding: 0;
  border-radius: 50%;
  color: #294862;
  font-size: 0.76rem;
  font-weight: 800;
  line-height: 1;
  text-decoration: none;
}

body.index #month_main td.today a.monthday {
  background: #249373;
  color: #FFFFFF;
  box-shadow: 0 4px 10px rgba(36, 147, 115, 0.25);
}

body.index #month_main a.day_overview::after {
  content: "›";
  position: absolute;
  right: 0.4rem;
  bottom: 0.35rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.35rem;
  height: 1.35rem;
  border-radius: 50%;
  background: #DDF4ED;
  color: #176B58;
  box-shadow: 0 3px 8px rgba(36, 147, 115, 0.14);
  font-size: 1rem;
  font-weight: 700;
  line-height: 1;
  opacity: 0;
  transform: scale(0.82);
  transition: opacity 0.16s ease, transform 0.16s ease;
}

body.index #month_main td:not(.invalid):hover a.day_overview::after,
body.index #month_main a.day_overview:focus::after {
  opacity: 1;
  transform: scale(1);
}

body.index #month_main div.booking_list {
  max-height: calc(100% - 2rem);
  padding: 0.1rem 0.3rem 0.4rem;
  box-sizing: border-box;
  overflow: auto;
}

body.index #month_main .booking_list > div {
  float: none;
  width: auto !important;
  min-height: 1.65rem;
  margin: 0.22rem 0;
  border: 1px solid #CDE9DA;
  border-left: 3px solid #35A27E;
  border-radius: 7px;
  background: #F0FDF4 !important;
  box-shadow: 0 2px 6px rgba(22, 101, 52, 0.07);
  line-height: 1.25;
  transition: border-color 0.16s ease, box-shadow 0.16s ease, transform 0.16s ease;
}

body.index #month_main .booking_list > div:hover {
  border-color: #9FD7BF;
  box-shadow: 0 5px 11px rgba(22, 101, 52, 0.13);
  transform: translateX(2px);
}

body.index #month_main .booking_list > div a {
  display: block;
  min-height: 1.65rem;
  padding: 0.32rem 0.42rem !important;
  box-sizing: border-box;
  overflow: hidden;
  background: transparent !important;
  color: #195C46 !important;
  font-size: 0.68rem;
  font-weight: 700;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
  word-break: normal;
}

body.index .dwm_main:not(#month_main) tbody th {
  padding: 0.3rem 0.55rem;
  background: #F5F9FB;
  color: #526B7E;
  font-size: 0.7rem;
  font-weight: 700;
}

body.index .dwm_main:not(#month_main) td.new {
  background: #FFFFFF;
}

body.index .dwm_main:not(#month_main) td.new:hover {
  background: #F0FAF6;
}

body.index .dwm_main:not(#month_main) .booked a,
body.index .dwm_main:not(#month_main) .booking {
  box-shadow: inset 3px 0 rgba(23, 50, 77, 0.18);
}

body.index div.timeline {
  height: 3px;
  border-radius: 999px;
  background: #F06A5A;
  box-shadow: 0 0 0 1px rgba(240, 106, 90, 0.16), 0 2px 7px rgba(240, 106, 90, 0.3);
}

body.index .dwm_main a:focus-visible,
body.index nav.main_calendar a:focus-visible {
  outline: 3px solid rgba(47, 120, 173, 0.35);
  outline-offset: 2px;
}

body.index .view_container > nav.main_calendar:last-child {
  margin-top: 0.8rem;
  margin-bottom: 0;
  opacity: 0.86;
}

@media (max-width: 48rem) {
  body.index > .contents {
    padding: 0.25rem 0.4rem 1rem;
  }

  body.index .view_container {
    padding: 0.65rem;
    border-radius: 15px;
  }

  body.index h2.date {
    min-width: 0;
    padding: 0.42rem 0.8rem 0.47rem 2.25rem;
    font-size: 1.02rem;
  }

  body.index h2.date::before {
    left: 0.75rem;
    width: 1.05rem;
    height: 1.05rem;
  }

  body.index nav.main_calendar {
    justify-content: center;
  }

  body.index .table_container {
    max-height: calc(100vh - 13.5rem);
    border-radius: 12px;
  }

  body.index #month_main {
    min-width: 700px;
  }

  body.index #month_main div.cell_container {
    min-height: 96px;
  }

  body.index .view_container > nav.main_calendar:last-child {
    display: none;
  }
}

/* Sur ordinateur, conserver le mois complet dans la fenêtre. */
@media (min-width: 48.01rem) {
  body.index[data-view="month"] > .contents {
    max-width: 100vw;
    padding-top: 0.2rem;
  }

  body.index[data-view="month"] .view_container {
    width: 100%;
    padding: 0.7rem 0.8rem;
    box-sizing: border-box;
  }

  body.index[data-view="month"] .date_heading {
    min-height: 2.6rem;
  }

  body.index[data-view="month"] nav.main_calendar {
    min-height: 2.35rem;
    margin: 0.45rem 0;
  }

  body.index[data-view="month"] .table_container {
    width: 100%;
    min-height: 0;
    max-height: none;
    overflow: hidden;
    box-sizing: border-box;
  }

  body.index[data-view="month"] table.dwm_main {
    width: 100%;
    min-width: 0;
    table-layout: fixed;
  }

  body.index[data-view="month"] #month_main div.cell_container {
    height: clamp(68px, calc((100vh - 19.5rem) / 6), 98px);
    min-height: 0;
  }

  body.index[data-view="month"] #month_main div.booking_list {
    min-width: 0;
  }

  body.index[data-view="month"] #month_main .booking_list > div,
  body.index[data-view="month"] #month_main .booking_list > div a {
    min-width: 0;
    max-width: 100%;
  }

  body.index[data-view="month"] .view_container > nav.main_calendar:last-child {
    display: none;
  }
}

/* Sur mobile, le mois devient une liste de journées lisible sans défilement horizontal. */
@media (max-width: 48rem) {
  body.index[data-view="month"] .view_container {
    padding: 0.55rem;
  }

  body.index[data-view="month"] .table_container {
    width: 100%;
    min-height: 0;
    max-height: none;
    overflow: visible;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
  }

  body.index[data-view="month"] #month_main {
    display: block;
    width: 100%;
    min-width: 0;
    background: transparent;
  }

  body.index[data-view="month"] #month_main thead {
    display: none;
  }

  body.index[data-view="month"] #month_main tbody,
  body.index[data-view="month"] #month_main tbody tr {
    display: block;
    width: 100%;
  }

  body.index[data-view="month"] #month_main td {
    position: relative;
    display: block;
    width: 100%;
    margin: 0 0 0.5rem;
    box-sizing: border-box;
    overflow: hidden;
    border: 1px solid #DCE8EE;
    border-radius: 12px;
    background: #FFFFFF;
    box-shadow: 0 5px 13px rgba(23, 50, 77, 0.07);
  }

  body.index[data-view="month"] #month_main td.invalid,
  body.index[data-view="month"] #month_main td.hidden_day {
    display: none;
  }

  body.index[data-view="month"] #month_main td.weekend {
    border-color: #E4DDEF;
    background: #FCFAFE;
  }

  body.index[data-view="month"] #month_main td.today {
    border-color: #79C5AB;
    background: linear-gradient(145deg, #EFFBF6, #F4FAFF);
    box-shadow: 0 7px 17px rgba(36, 147, 115, 0.13), inset 4px 0 #249373;
  }

  body.index[data-view="month"] #month_main td.past {
    border-color: #E0E4E8;
    background: #F1F3F5;
    box-shadow: 0 4px 10px rgba(107, 114, 128, 0.06);
  }

  body.index[data-view="month"] #month_main td::before {
    content: attr(data-weekday);
    position: absolute;
    top: 0.65rem;
    right: 0.75rem;
    z-index: 25;
    color: #718394;
    font-size: 0.64rem;
    font-weight: 800;
    letter-spacing: 0.07em;
    line-height: 1;
    text-transform: uppercase;
  }

  body.index[data-view="month"] #month_main td.today::before {
    color: #176B58;
  }

  body.index[data-view="month"] #month_main td.past::before {
    color: #929BA4;
  }

  body.index[data-view="month"] #month_main div.cell_container {
    height: auto;
    min-height: 4.5rem;
    padding: 0.25rem 0.35rem 0.4rem;
    box-sizing: border-box;
  }

  body.index[data-view="month"] #month_main div.cell_header {
    min-height: 2rem;
    height: 2rem;
    max-height: 2rem;
  }

  body.index[data-view="month"] #month_main div.cell_header a.monthday {
    margin-left: 0.2rem;
  }

  body.index[data-view="month"] #month_main div.booking_list {
    max-height: none;
    padding: 0.1rem 0.15rem 0.2rem;
    overflow: visible;
  }

  body.index[data-view="month"] #month_main .booking_list > div {
    min-height: 2rem;
    margin: 0.3rem 0;
  }

  body.index[data-view="month"] #month_main .booking_list > div a {
    min-height: 2rem;
    padding: 0.42rem 0.5rem !important;
    font-size: 0.72rem;
  }

  body.index[data-view="month"] #month_main a.day_overview::after {
    right: 0.55rem;
    bottom: 0.5rem;
    width: 1.55rem;
    height: 1.55rem;
    opacity: 1;
    transform: scale(1);
  }
}

/* Animation dynamique : impulsion centrale, zoom et vague rebondissante. */
body.index .view_container {
  position: relative;
  overflow: hidden;
  -webkit-animation: calendar-dynamic-panel 0.55s cubic-bezier(0.2, 0.8, 0.25, 1.08) backwards;
  animation: calendar-dynamic-panel 0.55s cubic-bezier(0.2, 0.8, 0.25, 1.08) backwards;
}

body.index .view_container::after {
  display: none;
}

body.index .date_heading {
  -webkit-animation: calendar-dynamic-title 0.48s cubic-bezier(0.2, 0.8, 0.25, 1.15) 0.06s backwards;
  animation: calendar-dynamic-title 0.48s cubic-bezier(0.2, 0.8, 0.25, 1.15) 0.06s backwards;
}

body.index .view_container > nav.main_calendar:first-of-type {
  -webkit-animation: calendar-dynamic-title 0.48s cubic-bezier(0.2, 0.8, 0.25, 1.15) 0.12s backwards;
  animation: calendar-dynamic-title 0.48s cubic-bezier(0.2, 0.8, 0.25, 1.15) 0.12s backwards;
}

body.index .table_container {
  -webkit-animation: calendar-dynamic-grid 0.58s cubic-bezier(0.2, 0.8, 0.25, 1.08) 0.14s backwards;
  animation: calendar-dynamic-grid 0.58s cubic-bezier(0.2, 0.8, 0.25, 1.08) 0.14s backwards;
}

body.index .dwm_main tbody tr:nth-child(odd),
body.index .dwm_main tbody tr:nth-child(even) {
  -webkit-animation: calendar-dynamic-row 0.42s ease-out backwards;
  animation: calendar-dynamic-row 0.42s ease-out backwards;
}

body.index .dwm_main tbody tr:nth-child(1) {
  -webkit-animation-delay: 0.2s;
  animation-delay: 0.2s;
}
body.index .dwm_main tbody tr:nth-child(2) {
  -webkit-animation-delay: 0.27s;
  animation-delay: 0.27s;
}
body.index .dwm_main tbody tr:nth-child(3) {
  -webkit-animation-delay: 0.34s;
  animation-delay: 0.34s;
}
body.index .dwm_main tbody tr:nth-child(4) {
  -webkit-animation-delay: 0.41s;
  animation-delay: 0.41s;
}
body.index .dwm_main tbody tr:nth-child(5) {
  -webkit-animation-delay: 0.48s;
  animation-delay: 0.48s;
}
body.index .dwm_main tbody tr:nth-child(6) {
  -webkit-animation-delay: 0.55s;
  animation-delay: 0.55s;
}

body.index .dwm_main tbody td {
  -webkit-animation: calendar-dynamic-cell 0.42s cubic-bezier(0.18, 0.75, 0.25, 1.22) backwards;
  animation: calendar-dynamic-cell 0.42s cubic-bezier(0.18, 0.75, 0.25, 1.22) backwards;
}

body.index .dwm_main tbody td:nth-child(1) { -webkit-animation-delay: 0.26s; animation-delay: 0.26s; }
body.index .dwm_main tbody td:nth-child(2) { -webkit-animation-delay: 0.3s; animation-delay: 0.3s; }
body.index .dwm_main tbody td:nth-child(3) { -webkit-animation-delay: 0.34s; animation-delay: 0.34s; }
body.index .dwm_main tbody td:nth-child(4) { -webkit-animation-delay: 0.38s; animation-delay: 0.38s; }
body.index .dwm_main tbody td:nth-child(5) { -webkit-animation-delay: 0.42s; animation-delay: 0.42s; }
body.index .dwm_main tbody td:nth-child(6) { -webkit-animation-delay: 0.46s; animation-delay: 0.46s; }
body.index .dwm_main tbody td:nth-child(7) { -webkit-animation-delay: 0.5s; animation-delay: 0.5s; }

body.index #month_main .booking_list > div {
  -webkit-animation: calendar-booking-pop 0.36s cubic-bezier(0.18, 0.75, 0.25, 1.18) 0.58s backwards;
  animation: calendar-booking-pop 0.36s cubic-bezier(0.18, 0.75, 0.25, 1.18) 0.58s backwards;
}

@-webkit-keyframes calendar-dynamic-panel {
  from { opacity: 0; -webkit-transform: translateY(16px) scale(0.94); }
  to { opacity: 1; -webkit-transform: translateY(0) scale(1); }
}

@keyframes calendar-dynamic-panel {
  from { opacity: 0; transform: translateY(16px) scale(0.94); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@-webkit-keyframes calendar-dynamic-title {
  from { opacity: 0; -webkit-transform: translateY(-18px) scale(0.88); }
  to { opacity: 1; -webkit-transform: translateY(0) scale(1); }
}

@keyframes calendar-dynamic-title {
  from { opacity: 0; transform: translateY(-18px) scale(0.88); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

@-webkit-keyframes calendar-dynamic-grid {
  from { opacity: 0; -webkit-transform: scale(0.9); }
  to { opacity: 1; -webkit-transform: scale(1); }
}

@keyframes calendar-dynamic-grid {
  from { opacity: 0; transform: scale(0.9); }
  to { opacity: 1; transform: scale(1); }
}

@-webkit-keyframes calendar-dynamic-row {
  from { opacity: 0; -webkit-transform: translateY(20px); }
  to { opacity: 1; -webkit-transform: translateY(0); }
}

@keyframes calendar-dynamic-row {
  from { opacity: 0; transform: translateY(20px); }
  to { opacity: 1; transform: translateY(0); }
}

@-webkit-keyframes calendar-dynamic-cell {
  0% { opacity: 0; -webkit-transform: translateY(-16px) scale(0.72); }
  72% { opacity: 1; -webkit-transform: translateY(3px) scale(1.04); }
  100% { opacity: 1; -webkit-transform: translateY(0) scale(1); }
}

@keyframes calendar-dynamic-cell {
  0% { opacity: 0; transform: translateY(-16px) scale(0.72); }
  72% { opacity: 1; transform: translateY(3px) scale(1.04); }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}

@-webkit-keyframes calendar-booking-pop {
  0% { opacity: 0; -webkit-transform: scale(0.72); }
  75% { opacity: 1; -webkit-transform: scale(1.06); }
  100% { opacity: 1; -webkit-transform: scale(1); }
}

@keyframes calendar-booking-pop {
  0% { opacity: 0; transform: scale(0.72); }
  75% { opacity: 1; transform: scale(1.06); }
  100% { opacity: 1; transform: scale(1); }
}

@media (prefers-reduced-motion: reduce) {
  body.index .view_container,
  body.index .date_heading,
  body.index .view_container > nav.main_calendar:first-of-type,
  body.index .table_container,
  body.index #month_main tbody tr,
  body.index .dwm_main:not(#month_main) tbody tr,
  body.index .dwm_main tbody td,
  body.index #month_main .booking_list > div {
    -webkit-animation: none !important;
    animation: none !important;
  }

  body.index .view_container::after {
    display: none;
  }
}

/* Les titres de sections du menu du compte n’ont plus de fond coloré. */
.banner nav.user-nav details.user-account-menu .settings-submenu-user-section,
.banner nav.user-nav details.user-account-menu .settings-submenu-admin-section {
  background: transparent !important;
}

/* Le bouton de l’utilisateur connecté reprend la palette rouge clair. */
.banner nav.user-nav details.user-account-menu > summary.connected-user {
  background: #FFF3F2 !important;
  color: #8D342F !important;
  box-shadow: 0 7px 16px rgba(141, 52, 47, 0.18) !important;
}

.banner nav.user-nav details.user-account-menu > summary.connected-user:hover,
.banner nav.user-nav details.user-account-menu > summary.connected-user:focus {
  background: #FDE4E2 !important;
  color: #742823 !important;
  box-shadow: 0 9px 20px rgba(141, 52, 47, 0.25) !important;
}

.banner nav.user-nav details.user-account-menu > summary.connected-user::after {
  color: #8D342F !important;
}

.banner nav.user-nav details.user-account-menu > summary.connected-user::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='8' r='3' fill='none' stroke='%238D342F' stroke-width='2'/%3E%3Cpath fill='none' stroke='%238D342F' stroke-width='2' d='M5 20c.7-3.4 3.1-5 7-5s6.3 1.6 7 5'/%3E%3C/svg%3E") !important;
}

/* Atténuer entièrement les journées et réservations déjà passées. */
body.index[data-view="month"] #month_main td.past {
  border-color: #E0E4E8 !important;
  background: #F1F3F5 !important;
  box-shadow: none !important;
}

body.index[data-view="month"] #month_main td.past div.cell_header a.monthday,
body.index[data-view="month"] #month_main td.past div.cell_header span.monthday,
body.index[data-view="month"] #month_main td.past::before {
  color: #A8AFB6 !important;
}

body.index[data-view="month"] #month_main td.past .booking_list > div {
  border-color: #D8DDE2 !important;
  border-left-color: #AEB6BE !important;
  background: #E7EAED !important;
  box-shadow: none !important;
}

body.index[data-view="month"] #month_main td.past .booking_list > div a,
body.index[data-view="month"] #month_main td.past .booking_list > div span.past_booking {
  display: block;
  min-height: 1.65rem;
  padding: 0.32rem 0.42rem !important;
  box-sizing: border-box;
  overflow: hidden;
  background: transparent !important;
  color: #929AA2 !important;
  font-size: 0.68rem;
  font-weight: 700;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

body.index[data-view="month"] #month_main td.past div.cell_header span.monthday {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.7rem;
  height: 1.7rem;
  margin: 0.25rem 0 0 0.35rem;
  border-radius: 50%;
  font-size: 0.76rem;
  font-weight: 800;
  line-height: 1;
}

/* Navigation de période : mois centré entre les deux flèches. */
body.index nav.main_calendar.calendar-period-nav {
  min-height: 3rem;
  margin: 0.25rem 0 0.65rem;
  justify-content: center;
}

body.index nav.main_calendar.calendar-period-nav > nav.arrow.with-date-heading {
  display: grid !important;
  flex: 0 1 auto;
  grid-template-columns: 2.25rem auto 2.25rem;
  align-items: center;
  justify-content: center;
  width: auto;
  max-width: 100%;
  gap: 0.4rem !important;
  margin: 0 auto;
}

body.index nav.arrow.with-date-heading .date_heading {
  grid-column: 2;
  min-width: 0;
  min-height: 2.9rem;
}

body.index nav.arrow.with-date-heading a.prev {
  grid-column: 1;
}

body.index nav.arrow.with-date-heading a.next {
  grid-column: 3;
}

body.index nav.arrow.with-date-heading a.prev,
body.index nav.arrow.with-date-heading a.next {
  border-color: #C6DEE8 !important;
  background: linear-gradient(120deg, #F2F8FC 0%, #FFFFFF 50%, #F2FAF7 100%) !important;
  color: #249373 !important;
  box-shadow: 0 5px 14px rgba(47, 120, 173, 0.11), inset 0 1px 0 rgba(255, 255, 255, 0.95) !important;
}

body.index nav.arrow.with-date-heading a.prev:hover,
body.index nav.arrow.with-date-heading a.prev:focus,
body.index nav.arrow.with-date-heading a.next:hover,
body.index nav.arrow.with-date-heading a.next:focus {
  border-color: #9DC9C0 !important;
  background: linear-gradient(120deg, #EAF5FB 0%, #F7FCFA 100%) !important;
  color: #176B58 !important;
  box-shadow: 0 7px 16px rgba(36, 147, 115, 0.16) !important;
}

@media (max-width: 30rem) {
  body.index nav.main_calendar.calendar-period-nav > nav.arrow.with-date-heading {
    gap: 0.28rem !important;
  }

  body.index nav.arrow.with-date-heading h2.date {
    padding-right: 0.65rem;
    padding-left: 2.15rem;
    font-size: 0.96rem;
  }
}

/* Composition finale de l’alerte de quota et de son action. */
#policy_details.has-quota-issue,
.booking-conflict-message.has-quota-issue {
  position: relative !important;
  display: block !important;
  width: 100% !important;
  max-width: 40rem !important;
  margin: 0.4rem auto !important;
  padding: 0.7rem 0.8rem 0.7rem 3.25rem !important;
  box-sizing: border-box !important;
  border: 1px solid #F0C5C2 !important;
  border-left: 3px solid #C95B52 !important;
  border-radius: 10px !important;
  background: linear-gradient(125deg, #FFF3F2 0%, #FFFFFF 52%, #FFF7F6 100%) !important;
  color: #6F3632 !important;
  box-shadow: 0 4px 12px rgba(141, 52, 47, 0.09) !important;
  font-size: 0.74rem !important;
  line-height: 1.4 !important;
}

#policy_details.has-quota-issue::before,
.booking-conflict-message.has-quota-issue::before {
  content: "!";
  position: absolute;
  top: 0.72rem;
  left: 0.72rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.7rem;
  height: 1.7rem;
  border-radius: 8px;
  background: linear-gradient(135deg, #D8675E, #B8443D);
  color: #FFFFFF;
  box-shadow: 0 3px 8px rgba(141, 52, 47, 0.2);
  font-size: 0.88rem;
  font-weight: 850;
  line-height: 1;
}

#policy_details.has-quota-issue > p:first-child,
.booking-conflict-message.has-quota-issue h2 {
  display: block !important;
  width: auto !important;
  margin: 0 0 0.4rem !important;
  padding: 0 !important;
  border: 0 !important;
  background: transparent !important;
  color: #8D342F !important;
  box-shadow: none !important;
  font-size: 0.86rem !important;
  font-weight: 800 !important;
  line-height: 1.3 !important;
  text-decoration: none !important;
}

#policy_details.has-quota-issue > p:first-child strong,
#policy_details.has-quota-issue > p:first-child u {
  color: #8D342F !important;
  text-decoration: none !important;
}

.booking-conflict-message.has-quota-issue h2::before {
  display: none !important;
}

#policy_details.has-quota-issue ul,
.booking-conflict-message.has-quota-issue ul {
  margin: 0 !important;
  padding: 0 !important;
  list-style: none !important;
}

#policy_details.has-quota-issue li,
.booking-conflict-message.has-quota-issue li {
  margin: 0 !important;
  padding: 0.42rem 0.55rem !important;
  border: 0 !important;
  border-radius: 7px !important;
  background: rgba(255, 248, 247, 0.82) !important;
  color: #6F3632 !important;
  font-size: 0.72rem !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
}

#policy_details.has-quota-issue button.quota-increase-request-button,
.booking-conflict-message.has-quota-issue input.quota-increase-request-button {
  min-height: 1.95rem !important;
  margin-top: 0.5rem !important;
  padding: 0.28rem 0.75rem 0.28rem 2rem !important;
  border-color: #C95B52 !important;
  background-color: #C95B52 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 6h16v12H4zM4 7l8 6 8-6' fill='none' stroke='%23FFFFFF' stroke-width='1.8' stroke-linejoin='round'/%3E%3C/svg%3E"), linear-gradient(120deg, #D8675E 0%, #C95B52 52%, #B8443D 100%) !important;
  background-position: 0.65rem center, 0 0 !important;
  background-size: 0.9rem, 100% 100% !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  box-shadow: 0 5px 13px rgba(141, 52, 47, 0.22) !important;
  font-size: 0.7rem !important;
}

#policy_details.has-quota-issue button.quota-increase-request-button:hover,
#policy_details.has-quota-issue button.quota-increase-request-button:focus,
.booking-conflict-message.has-quota-issue input.quota-increase-request-button:hover,
.booking-conflict-message.has-quota-issue input.quota-increase-request-button:focus {
  border-color: #A83B35 !important;
  background-color: #B8443D !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 6h16v12H4zM4 7l8 6 8-6' fill='none' stroke='%23FFFFFF' stroke-width='1.8' stroke-linejoin='round'/%3E%3C/svg%3E"), linear-gradient(120deg, #C95B52 0%, #B8443D 55%, #9E332E 100%) !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  box-shadow: 0 7px 17px rgba(141, 52, 47, 0.3) !important;
}

.booking-conflict-message.has-quota-issue .quota-increase-request-form {
  margin: 0 !important;
}

@media (max-width: 36rem) {
  #policy_details.has-quota-issue,
  .booking-conflict-message.has-quota-issue {
    padding: 0.65rem 0.65rem 0.65rem 3rem !important;
  }

  #policy_details.has-quota-issue::before,
  .booking-conflict-message.has-quota-issue::before {
    top: 0.67rem;
    left: 0.67rem;
  }

  #policy_details.has-quota-issue button.quota-increase-request-button,
  .booking-conflict-message.has-quota-issue input.quota-increase-request-button {
    width: auto !important;
  }
}

/* Priorité absolue : le bouton d’augmentation de quota reste rouge malgré les
 * règles génériques appliquées aux boutons de formulaire. */
html body.edit_entry form#main #policy_details.has-quota-issue button.quota-increase-request-button,
html body .booking-conflict-page .booking-conflict-message.has-quota-issue form:not(#show_my_entries) input[type="submit"].quota-increase-request-button {
  border-color: #B8443D !important;
  background-color: #C95B52 !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 6h16v12H4zM4 7l8 6 8-6' fill='none' stroke='%23FFFFFF' stroke-width='1.8' stroke-linejoin='round'/%3E%3C/svg%3E") !important;
  background-position: 0.65rem center !important;
  background-repeat: no-repeat !important;
  background-size: 0.9rem !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  box-shadow: 0 5px 13px rgba(141, 52, 47, 0.24) !important;
}

html body.edit_entry form#main #policy_details.has-quota-issue button.quota-increase-request-button:hover,
html body.edit_entry form#main #policy_details.has-quota-issue button.quota-increase-request-button:focus,
html body .booking-conflict-page .booking-conflict-message.has-quota-issue form:not(#show_my_entries) input[type="submit"].quota-increase-request-button:hover,
html body .booking-conflict-page .booking-conflict-message.has-quota-issue form:not(#show_my_entries) input[type="submit"].quota-increase-request-button:focus {
  border-color: #96332E !important;
  background-color: #A83B35 !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  box-shadow: 0 7px 17px rgba(141, 52, 47, 0.32) !important;
}
/* Administration centralisée du calendrier. */
.calendar-settings-page {
  width: min(100%, 980px);
  margin-inline: auto;
}

.calendar-settings-shell {
  overflow: hidden;
  border: 1px solid #d7e7ee;
  border-radius: 22px;
  background: #fff;
  box-shadow: 0 16px 42px rgba(23, 50, 77, .09);
}

.calendar-settings-header {
  padding: 28px 32px;
  border-bottom: 1px solid #d8e8ee;
  background: linear-gradient(135deg, #f1f9fc 0%, #eef9f5 100%);
}

.calendar-settings-kicker {
  color: #238f73;
  font-size: .72rem;
  font-weight: 800;
  letter-spacing: .12em;
  text-transform: uppercase;
}

.calendar-settings-header h1 {
  margin: 5px 0 7px;
  color: #17324d;
  font-size: clamp(1.5rem, 3vw, 2rem);
}

.calendar-settings-header p,
.calendar-settings-card p {
  margin: 0;
  color: #647c8d;
  line-height: 1.5;
}

.calendar-settings-form {
  display: grid;
  gap: 16px;
  padding: 24px 32px 30px;
}

.calendar-settings-card {
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  gap: 17px;
  padding: 21px;
  border: 1px solid #dce9ee;
  border-radius: 16px;
  background: #fbfdfd;
}

.calendar-settings-card-icon {
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 13px;
  background: #e4f5f0;
  color: #238f73;
  font-weight: 800;
}

.calendar-settings-card-icon-sunday { background: #fff1ef; color: #b34c45; }
.calendar-settings-card-icon-time { background: #eaf3fa; color: #2c6685; font-size: 1.5rem; }
.calendar-settings-card-content h2 { margin: 0 0 4px; color: #1b4a62; font-size: 1.05rem; }
.calendar-settings-card-content > label:not(.calendar-settings-switch) { display: block; margin: 16px 0 7px; color: #294862; font-weight: 700; }

.calendar-settings-card input[type="text"],
.calendar-settings-card input[type="time"] {
  box-sizing: border-box;
  width: 100%;
  min-height: 44px;
  padding: 9px 12px;
  border: 1px solid #c9dce5;
  border-radius: 10px;
  background: #fff;
  color: #17324d;
}

.calendar-settings-time-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 220px)); gap: 15px; margin-top: 16px; }
.calendar-settings-time-grid label span { display: block; margin-bottom: 7px; color: #294862; font-weight: 700; }

.calendar-settings-switch { display: inline-flex; align-items: center; gap: 11px; margin-top: 17px; color: #294862; font-weight: 700; cursor: pointer; }
.calendar-settings-switch input { position: absolute; opacity: 0; }
.calendar-settings-switch-track { position: relative; width: 46px; height: 25px; border-radius: 999px; background: #b7c8d1; transition: background .18s ease; }
.calendar-settings-switch-track::after { content: ""; position: absolute; top: 3px; left: 3px; width: 19px; height: 19px; border-radius: 50%; background: #fff; box-shadow: 0 2px 5px rgba(23,50,77,.25); transition: transform .18s ease; }
.calendar-settings-switch input:checked + .calendar-settings-switch-track { background: #249373; }
.calendar-settings-switch input:checked + .calendar-settings-switch-track::after { transform: translateX(21px); }
.calendar-settings-switch input:focus-visible + .calendar-settings-switch-track { outline: 3px solid rgba(36,147,115,.25); outline-offset: 2px; }

.calendar-settings-success,
.calendar-settings-errors { margin: 20px 32px 0; padding: 13px 16px; border-radius: 12px; font-weight: 700; }
.calendar-settings-success { border: 1px solid #adddce; background: #edf9f4; color: #176f58; }
.calendar-settings-errors { border: 1px solid #efc4c0; background: #fff1ef; color: #a33e38; }
.calendar-settings-errors ul { margin: 0; padding-left: 20px; }
.calendar-settings-actions { display: flex; justify-content: flex-end; gap: 10px; padding-top: 3px; }
.calendar-settings-actions .calendar-settings-save { border-color: #1e7f67; background: #249373; color: #fff; }

.settings-layout .settings-link.calendar-settings-link {
  min-height: 2.35rem !important;
  height: 2.35rem !important;
  max-height: none !important;
  border: 1px solid #1d8067 !important;
  background: linear-gradient(135deg, #249373, #2c809b) !important;
  color: #fff !important;
  font-weight: 800 !important;
  box-shadow: 0 8px 18px rgba(36, 147, 115, .24) !important;
}

.profile-admin-calendar {
  display: grid;
  grid-template-columns: 44px minmax(0, 1fr) auto;
  align-items: center;
  gap: 14px;
  margin: 0 0 18px;
  padding: 15px 17px;
  border: 1px solid #b9ddd2;
  border-radius: 15px;
  background: linear-gradient(135deg, #eef9f5, #f0f7fb);
  color: #294862;
  box-shadow: 0 8px 20px rgba(23, 50, 77, .08);
}

.profile-admin-calendar-icon {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 12px;
  background: #249373;
  color: #fff;
}

.profile-admin-calendar-icon svg { width: 24px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.profile-admin-calendar strong,
.profile-admin-calendar span { display: block; }
.profile-admin-calendar strong { margin-bottom: 2px; color: #17324d; }
.profile-admin-calendar span { color: #647c8d; font-size: .82rem; }
.profile-admin-calendar .profile-admin-calendar-link { border-color: #1d8067 !important; background: #249373 !important; color: #fff !important; white-space: nowrap; }


@media (max-width: 640px) {
  .calendar-settings-header,
  .calendar-settings-form { padding-inline: 18px; }
  .calendar-settings-card { grid-template-columns: 1fr; }
  .calendar-settings-time-grid { grid-template-columns: 1fr 1fr; }
  .calendar-settings-success,
  .calendar-settings-errors { margin-inline: 18px; }
  .profile-admin-calendar { grid-template-columns: 42px minmax(0, 1fr); }
  .profile-admin-calendar .profile-admin-calendar-link { grid-column: 1 / -1; width: 100%; text-align: center; }
}

/* Gestion du calendrier : dimensions communes aux écrans d'administration. */
.settings-page.calendar-settings-page {
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 1rem 2rem !important;
  box-sizing: border-box !important;
}

.calendar-settings-page .calendar-settings-shell {
  width: min(100%, 46rem);
  margin: 2rem auto 0;
  padding: 1.4rem;
  box-sizing: border-box;
  overflow: visible;
  border: 1px solid #D8E2EC;
  border-radius: 18px;
  background: #F8FAFC;
  color: #17324D;
  box-shadow: 0 16px 38px rgba(23, 50, 77, .12);
}

.calendar-settings-page .calendar-settings-header {
  margin-bottom: 1.15rem;
  padding: 0 .2rem 1rem;
  border: 0;
  border-bottom: 1px solid #DFE7EF;
  background: transparent;
}

.calendar-settings-page .calendar-settings-kicker {
  display: block;
  margin-bottom: .25rem;
  color: #397FB3;
  font-size: .7rem;
  letter-spacing: .12em;
}

.calendar-settings-page .calendar-settings-header h1 {
  display: flex;
  align-items: center;
  gap: .55rem;
  width: fit-content;
  margin: 0;
  padding: .4rem .7rem .4rem .45rem;
  border: 1px solid #D2E6EE;
  border-radius: 11px;
  background: linear-gradient(135deg, #EAF4FC 0%, #EDF8F3 100%);
  color: #235F89;
  font-size: 1.02rem;
  font-weight: 750;
  line-height: 1.3;
  box-shadow: 0 4px 12px rgba(47, 120, 173, .08);
}

.calendar-settings-title-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.65rem;
  height: 1.65rem;
  flex: 0 0 1.65rem;
  border: 1px solid #C9E0EC;
  border-radius: 8px;
  background: rgba(255, 255, 255, .82);
  color: #2F78AD;
}

.calendar-settings-title-icon svg {
  width: 1.05rem;
  height: 1.05rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.calendar-settings-page .calendar-settings-header p {
  max-width: 42rem;
  margin: .4rem 0 0;
  color: #64748B;
  font-size: .86rem;
  line-height: 1.5;
}

.calendar-settings-page .calendar-settings-form {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .85rem;
  padding: 0;
}

.calendar-settings-page .calendar-settings-card {
  grid-template-columns: 2.25rem minmax(0, 1fr);
  gap: .75rem;
  padding: 1rem;
  border-color: #D8E4EC;
  border-radius: 13px;
  background: #FFFFFF;
  box-shadow: 0 6px 16px rgba(23, 50, 77, .06);
}

.calendar-settings-page .calendar-settings-site-card,
.calendar-settings-page .calendar-settings-actions {
  grid-column: 1 / -1;
}

.calendar-settings-page .calendar-settings-card-icon {
  width: 2.15rem;
  height: 2.15rem;
  border-radius: 9px;
  font-size: .72rem;
}

.calendar-settings-page .calendar-settings-card-icon-time { font-size: 1.15rem; }
.calendar-settings-page .calendar-settings-card-content h2 { font-size: .88rem; }
.calendar-settings-page .calendar-settings-card p { font-size: .74rem; line-height: 1.45; }
.calendar-settings-page .calendar-settings-card-content > label:not(.calendar-settings-switch) { margin-top: .8rem; font-size: .74rem; }
.calendar-settings-page .calendar-settings-time-grid { grid-template-columns: 1fr 1fr; gap: .6rem; margin-top: .8rem; }
.calendar-settings-page .calendar-settings-time-grid label span { font-size: .7rem; }
.calendar-settings-page .calendar-settings-card input[type="text"],
.calendar-settings-page .calendar-settings-card input[type="time"] { min-height: 2.35rem; font-size: .76rem; }
.calendar-settings-page .calendar-settings-switch { margin-top: .85rem; font-size: .72rem; line-height: 1.35; }
.calendar-settings-page .calendar-settings-actions { padding-top: .15rem; }
.calendar-settings-page .calendar-settings-actions .button {
  min-height: 1.85rem !important;
  padding: .3rem .8rem !important;
  border-radius: 20px !important;
  font-size: .74rem !important;
  font-weight: 700 !important;
}

.calendar-settings-page .calendar-settings-success,
.calendar-settings-page .calendar-settings-errors {
  margin: 0 0 .85rem;
  padding: .7rem .85rem;
  font-size: .76rem;
}

@media (max-width: 44rem) {
  .settings-page.calendar-settings-page { padding: 0 .8rem 1.25rem !important; }
  .calendar-settings-page .calendar-settings-shell { margin-top: .8rem; padding: .8rem; border-radius: 12px; }
  .calendar-settings-page .calendar-settings-header { margin-bottom: .75rem; padding-bottom: .7rem; }
  .calendar-settings-page .calendar-settings-header h1 { font-size: .96rem; }
  .calendar-settings-page .calendar-settings-form { grid-template-columns: minmax(0, 1fr); gap: .6rem; }
  .calendar-settings-page .calendar-settings-site-card,
  .calendar-settings-page .calendar-settings-actions { grid-column: auto; }
  .calendar-settings-page .calendar-settings-card { padding: .75rem; border-radius: 11px; }
}

/* Section Administration repliable dans le menu du compte. */
.banner nav.user-nav .settings-submenu-admin-group {
  display: block !important;
  width: 100% !important;
  box-sizing: border-box !important;
  margin: .18rem 0 0;
  border: 0;
}

.banner nav.user-nav details.user-account-menu .settings-submenu-admin-group > summary.settings-submenu-admin-section {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  width: 100% !important;
  height: 1.9rem !important;
  min-height: 1.9rem !important;
  box-sizing: border-box !important;
  margin: .18rem 0 .08rem !important;
  padding: .3rem .65rem !important;
  border: 1px solid #D9D0F5 !important;
  border-radius: 9px !important;
  background: linear-gradient(135deg, #F5F2FC, #F0F4FA) !important;
  color: #6246A8 !important;
  box-shadow: 0 3px 8px rgba(98, 70, 168, .08) !important;
  font-size: .68rem !important;
  font-weight: 800 !important;
  letter-spacing: .04em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  cursor: pointer;
  list-style: none !important;
  list-style-type: none !important;
  appearance: none;
  -webkit-appearance: none;
  user-select: none;
}

.banner nav.user-nav details.user-account-menu .settings-submenu-admin-group > summary.settings-submenu-admin-section .settings-submenu-section-title::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='none' stroke='%236246A8' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M12 3 4 6v5c0 5 3.4 8.2 8 10 4.6-1.8 8-5 8-10V6zM9 12l2 2 4-4'/%3E%3C/svg%3E") !important;
}

.banner nav.user-nav details.user-account-menu .settings-submenu-admin-group > summary.settings-submenu-admin-section::-webkit-details-marker {
  display: none;
}

.banner nav.user-nav details.user-account-menu .settings-submenu-admin-group > summary.settings-submenu-admin-section::marker {
  display: none;
  content: '';
  font-size: 0;
}

.banner nav.user-nav details.user-account-menu .settings-submenu-admin-group > summary.settings-submenu-admin-section::after {
  content: '▾';
  display: inline-block;
  flex: 0 0 auto;
  margin-left: auto;
  color: #6246A8;
  font-size: 1rem;
  font-weight: 800;
  line-height: .8;
  transition: transform .18s ease;
}

.banner nav.user-nav details.user-account-menu .settings-submenu-admin-group[open] > summary.settings-submenu-admin-section::after {
  transform: rotate(180deg);
}

.banner nav.user-nav details.user-account-menu .settings-submenu-admin-group > summary.settings-submenu-admin-section:hover,
.banner nav.user-nav details.user-account-menu .settings-submenu-admin-group > summary.settings-submenu-admin-section:focus-visible {
  border-color: #C8BAED !important;
  background: #EEE9FA !important;
  color: #6246A8 !important;
  box-shadow: 0 4px 10px rgba(98, 70, 168, .13) !important;
  outline: none;
}

.banner nav.user-nav .settings-submenu-admin-group .settings-submenu-section-title {
  flex: 1 1 auto;
}

.banner nav.user-nav .settings-submenu-admin-links {
  display: grid;
  gap: .28rem;
  margin: .25rem 0 .08rem .62rem;
  padding: 0 0 0 .42rem;
  border-left: 2px solid #DED5F0;
}

.banner nav.user-nav .settings-submenu-admin-links .settings-submenu-link {
  width: auto !important;
  min-height: 1.75rem !important;
  border: 0 !important;
  background-color: #F3F4F6 !important;
  color: #8D342F !important;
  box-shadow: none !important;
}

.banner nav.user-nav .settings-submenu-admin-links .settings-submenu-link:hover,
.banner nav.user-nav .settings-submenu-admin-links .settings-submenu-link:focus {
  border-color: transparent !important;
  background-color: #E5E7EB !important;
  color: #742823 !important;
}

.banner nav.user-nav .settings-submenu-admin-links .settings-submenu-link::before {
  filter: none !important;
  opacity: 1;
}

/* Priorité finale : le texte des seules actions administratives reste rouge. */
.banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-admin-links .settings-submenu-link,
.banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-admin-links .settings-submenu-link:visited {
  color: #8D342F !important;
  -webkit-text-fill-color: #8D342F !important;
}

.banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-admin-links .settings-submenu-link:hover,
.banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-admin-links .settings-submenu-link:focus {
  color: #742823 !important;
  -webkit-text-fill-color: #742823 !important;
}

.banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-admin-links .settings-submenu-calendar::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Crect x='3' y='5' width='18' height='16' rx='3' fill='none' stroke='%231F2937' stroke-width='2'/%3E%3Cpath d='M8 3v4m8-4v4M3 10h18M8 14h3m2 0h3m-8 3h3' fill='none' stroke='%231F2937' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") !important;
  filter: none !important;
  opacity: 1 !important;
}

.banner nav.user-nav .settings-submenu-admin-links-visible {
  gap: .3rem !important;
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
}

/* Nouveau bouton Administration : copie visuelle fidèle du titre Mon espace. */
.banner nav.user-nav details.user-account-menu .settings-submenu-admin-clean > summary.settings-submenu-admin-toggle {
  display: flex !important;
  align-items: center !important;
  width: 100% !important;
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  box-sizing: border-box !important;
  margin: .25rem 0 .05rem !important;
  padding: 4px 16px !important;
  border: 1px solid transparent !important;
  border-radius: 20px !important;
  background: #F3F4F6 !important;
  color: #1F2937 !important;
  box-shadow: none !important;
  font-size: .8rem !important;
  font-weight: 700 !important;
  letter-spacing: normal !important;
  line-height: 1 !important;
  text-transform: none !important;
  list-style: none !important;
  appearance: none;
  -webkit-appearance: none;
  cursor: pointer;
}

.banner nav.user-nav details.user-account-menu .settings-submenu-admin-clean > summary.settings-submenu-admin-toggle::-webkit-details-marker {
  display: none;
}

.banner nav.user-nav details.user-account-menu .settings-submenu-admin-clean > summary.settings-submenu-admin-toggle::marker {
  content: '';
  font-size: 0;
}

.banner nav.user-nav details.user-account-menu .settings-submenu-admin-clean > summary.settings-submenu-admin-toggle::after {
  content: '▾';
  display: inline-block;
  margin-left: auto;
  color: #1F2937;
  font-size: 1rem;
  font-weight: 800;
  line-height: .8;
  transition: transform .18s ease;
}

.banner nav.user-nav details.user-account-menu .settings-submenu-admin-clean[open] > summary.settings-submenu-admin-toggle::after {
  transform: rotate(180deg);
}

.banner nav.user-nav details.user-account-menu .settings-submenu-admin-clean > summary.settings-submenu-admin-toggle:hover,
.banner nav.user-nav details.user-account-menu .settings-submenu-admin-clean > summary.settings-submenu-admin-toggle:focus-visible {
  background: #E5E7EB !important;
  outline: none;
}

@media (max-width: 40rem) {
  .banner nav.user-nav {
    transform: translateX(-.45rem);
  }
}

/* Le menu du compte reste ancré au bouton utilisateur sur mobile. */
@media (max-width: 58rem) {
  header.banner:not(.simple) {
    position: relative !important;
    z-index: 50000 !important;
    isolation: isolate;
    overflow: visible !important;
  }

  .banner nav.container,
  .banner nav.user-nav {
    position: relative !important;
    z-index: 50001 !important;
    overflow: visible !important;
  }

  .banner nav.user-nav > details.user-account-menu {
    position: static !important;
    z-index: 50002 !important;
    display: inline-block !important;
    flex: 0 0 auto !important;
    height: 1.75rem !important;
    min-height: 1.75rem !important;
    max-height: 1.75rem !important;
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu {
    position: absolute !important;
    top: calc(100% + .45rem) !important;
    right: auto !important;
    left: 50% !important;
    width: min(17rem, calc(100vw - 1rem)) !important;
    min-width: 0 !important;
    max-width: calc(100vw - 1rem) !important;
    max-height: calc(100vh - 5rem) !important;
    overflow-x: hidden !important;
    overflow-y: auto !important;
    transform: translateX(-50%) !important;
    z-index: 50003 !important;
  }
}

/* Titres de section sobres : aucun pictogramme ne doit ressembler à un second bouton. */
.banner nav.user-nav details.user-account-menu .settings-submenu-user-section .settings-submenu-section-title::before,
.banner nav.user-nav details.user-account-menu .settings-submenu-admin-section .settings-submenu-section-title::before {
  display: none !important;
  content: none !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  background: none !important;
}
/* Calendrier public en lecture seule jusqu'à la connexion. */
body.index:not(.logged_in) .view_container.calendar_read_only a,
body.index:not(.logged_in) .view_container.calendar_read_only button,
body.index:not(.logged_in) .view_container.calendar_read_only input,
body.index:not(.logged_in) .view_container.calendar_read_only select {
  pointer-events: none !important;
  cursor: default !important;
}

/* Réservations du calendrier : palette bleue commune aux différentes vues. */
body.index #month_main td:not(.past) .booking_list > div {
  border-color: #BED9EB !important;
  border-left-color: #3C8CCC !important;
  background: #D7ECFA !important;
  box-shadow: 0 2px 7px rgba(47, 120, 173, 0.1) !important;
}

body.index #month_main td:not(.past) .booking_list > div:hover {
  border-color: #92BFDC !important;
  background: #C7E3F4 !important;
  box-shadow: 0 5px 12px rgba(47, 120, 173, 0.17) !important;
}

body.index #month_main td:not(.past) .booking_list > div a,
body.index #month_main td:not(.past) .booking_list > div span {
  color: #245A7A !important;
}

body.index .dwm_main:not(#month_main) td.booked .booking {
  border-color: #BED9EB !important;
  border-left-color: #3C8CCC !important;
  background: #D7ECFA !important;
  box-shadow: 0 3px 9px rgba(47, 120, 173, 0.12) !important;
}

body.index .dwm_main:not(#month_main) td.booked .booking > a {
  background: transparent !important;
  color: #244F6A !important;
}

body.index .dwm_main:not(#month_main) td.booked .booking > a:hover,
body.index .dwm_main:not(#month_main) td.booked .booking > a:focus {
  background: #C7E3F4 !important;
  box-shadow: inset 0 0 0 2px rgba(60, 140, 204, 0.15) !important;
}

body.index .dwm_main:not(#month_main) .booking_time {
  background: #D9ECF8 !important;
  color: #245F86 !important;
}

body.index .dwm_main:not(#month_main) .booking_name {
  color: #244F6A !important;
}

/* Chaque créateur conserve sa propre couleur, calculée côté serveur. */
body.index #month_main td:not(.past) .booking_list > div.user_colored_booking {
  border-color: var(--booking-user-border) !important;
  border-left-color: var(--booking-user-border) !important;
  background: var(--booking-user-bg) !important;
  box-shadow: 0 2px 7px color-mix(in srgb, var(--booking-user-border) 22%, transparent) !important;
}

body.index #month_main td:not(.past) .booking_list > div.user_colored_booking:hover {
  background: var(--booking-user-hover) !important;
}

body.index #month_main td:not(.past) .booking_list > div.user_colored_booking a,
body.index #month_main td:not(.past) .booking_list > div.user_colored_booking span {
  color: var(--booking-user-text) !important;
}

body.index .dwm_main:not(#month_main) td.booked .booking.user_colored_booking {
  border-color: var(--booking-user-border) !important;
  border-left-color: var(--booking-user-border) !important;
  background: var(--booking-user-bg) !important;
  box-shadow: 0 3px 9px color-mix(in srgb, var(--booking-user-border) 24%, transparent) !important;
}

body.index .dwm_main:not(#month_main) td.booked .booking.user_colored_booking > a {
  color: var(--booking-user-text) !important;
}

body.index .dwm_main:not(#month_main) td.booked .booking.user_colored_booking > a:hover,
body.index .dwm_main:not(#month_main) td.booked .booking.user_colored_booking > a:focus {
  background: var(--booking-user-hover) !important;
}

body.index .dwm_main:not(#month_main) .booking.user_colored_booking .booking_time {
  background: var(--booking-user-chip) !important;
  color: var(--booking-user-text) !important;
}

body.index .dwm_main:not(#month_main) .booking.user_colored_booking .booking_name {
  color: var(--booking-user-text) !important;
}

body.index:not(.logged_in) .view_container.calendar_read_only a[aria-disabled="true"] {
  text-decoration: none !important;
}

body.index:not(.logged_in) .view_container.calendar_read_only #month_main td:not(.past):hover {
  box-shadow: none !important;
}

/* Super administration : identité, logos, animation et sauvegarde. */
.settings-submenu-section-label {
  margin: 0.55rem 0.65rem 0.25rem;
  padding: 0.4rem 0.55rem;
  border: 0;
  border-radius: 8px;
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.settings-submenu-user-label {
  margin-top: 0.1rem;
  background: transparent;
  color: #245F87;
  box-shadow: none;
}

.settings-submenu-admin-label {
  background: transparent;
  color: #C43838;
  box-shadow: none;
}

/* La maintenance est une action de super administrateur distincte. */
.banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-admin-links .settings-submenu-maintenance,
.banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-admin-links .settings-submenu-maintenance:visited {
  background-color: #FFF1DE !important;
  color: #C65D00 !important;
  -webkit-text-fill-color: #C65D00 !important;
}

.banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-admin-links .settings-submenu-maintenance:hover,
.banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-admin-links .settings-submenu-maintenance:focus {
  background-color: #FFE2BD !important;
  color: #9E4700 !important;
  -webkit-text-fill-color: #9E4700 !important;
}

.banner nav.user-nav details.user-account-menu .settings-submenu-maintenance::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='3' fill='none' stroke='%23C65D00' stroke-width='2'/%3E%3Cpath d='M12 2v3m0 14v3M2 12h3m14 0h3M4.9 4.9 7 7m10 10 2.1 2.1M19.1 4.9 17 7M7 17l-2.1 2.1' fill='none' stroke='%23C65D00' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") !important;
}

.maintenance-page {
  width: min(52rem, calc(100% - 2rem));
  margin: 1rem auto 1.75rem;
}

.maintenance-shell {
  display: grid;
  gap: 0.7rem;
}

.maintenance-header,
.maintenance-card {
  box-sizing: border-box;
  border: 1px solid #D7E5F1;
  border-radius: 14px;
  background: #FFFFFF;
  box-shadow: 0 10px 24px rgba(23, 50, 77, 0.09);
}

.maintenance-header {
  padding: 0.8rem 1rem;
}

.maintenance-kicker {
  color: #A52A2A;
  font-size: 0.68rem;
  font-weight: 900;
  letter-spacing: 0.09em;
  text-transform: uppercase;
}

.maintenance-header h1 {
  margin: 0.15rem 0 0.2rem;
  color: #17324D;
  font-size: 1.3rem;
}

.maintenance-header p,
.maintenance-card-heading p {
  margin: 0;
  color: #60758A;
  line-height: 1.45;
}

.maintenance-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.7rem;
}

.maintenance-card {
  padding: 0.75rem;
}

.maintenance-form .maintenance-card:nth-of-type(2),
.maintenance-backup-card,
.maintenance-actions {
  grid-column: 1;
}

/* Sur ordinateur, les cartes utilisent toute la largeur sans zones mortes. */
.maintenance-identity-card {
  display: grid;
  grid-template-columns: minmax(14rem, 0.8fr) minmax(18rem, 1.2fr);
  grid-template-rows: auto auto;
  align-items: center;
  gap: 0.3rem 1rem;
}

.maintenance-identity-card .maintenance-card-heading {
  grid-column: 1;
  grid-row: 1 / 3;
  margin-bottom: 0;
}

.maintenance-identity-card > label {
  grid-column: 2;
  grid-row: 1;
  align-self: end;
}

.maintenance-identity-card > input {
  grid-column: 2;
  grid-row: 2;
}

.maintenance-animation-card {
  display: grid;
  grid-template-columns: minmax(14rem, 0.72fr) minmax(26rem, 1.28fr);
  grid-template-rows: auto auto;
  align-items: center;
  gap: 0.35rem 1rem;
}

.maintenance-animation-card .maintenance-card-heading {
  grid-column: 1;
  grid-row: 1;
  margin-bottom: 0;
}

.maintenance-animation-card > .calendar-settings-switch {
  grid-column: 1;
  grid-row: 2;
}

.maintenance-animation-card .maintenance-animation-grid {
  grid-column: 2;
  grid-row: 1 / 3;
  margin-top: 0;
}

.maintenance-mail-card .maintenance-card-icon {
  background: #FFF0E8;
  color: #B55325;
}

.maintenance-mail-card > .maintenance-card-heading {
  align-items: center;
}

.maintenance-mail-card > .maintenance-card-heading > div {
  min-width: 0;
}

.maintenance-mail-status {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  margin-left: auto;
  padding: 0.3rem 0.55rem;
  border-radius: 999px;
  background: #E9F7F1;
  color: #26765E;
  font-size: 0.68rem;
  font-weight: 800;
  white-space: nowrap;
}

.maintenance-mail-status > span {
  color: #2DA67D;
  font-size: 0.7rem;
}

.maintenance-mail-sections {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0.65rem;
}

.maintenance-mail-section {
  min-width: 0;
  padding: 0.75rem;
  border: 1px solid #DCE6ED;
  border-radius: 12px;
  background: #FAFCFD;
}

.maintenance-mail-section > header {
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
  margin-bottom: 0.65rem;
}

.maintenance-mail-section > header > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 1.55rem;
  width: 1.55rem;
  height: 1.55rem;
  border-radius: 50%;
  background: #EAF3F8;
  color: #326984;
  font-size: 0.72rem;
  font-weight: 900;
}

.maintenance-mail-section h3 {
  margin: 0 0 0.1rem;
  color: #1D455D;
  font-size: 0.82rem;
}

.maintenance-mail-section header p {
  margin: 0;
  color: #6C7F90;
  font-size: 0.7rem;
  line-height: 1.35;
}

.maintenance-mail-connection-grid,
.maintenance-mail-credentials,
.maintenance-mail-sender-grid {
  display: grid;
  gap: 0.55rem;
}

.maintenance-mail-connection-grid {
  grid-template-columns: minmax(14rem, 1fr) minmax(6.5rem, 0.28fr) minmax(11rem, 0.48fr);
}

.maintenance-mail-credentials {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin-top: 0.6rem;
  transition: opacity 0.18s ease;
}

.maintenance-mail-credentials.is-inactive {
  opacity: 0.48;
}

.maintenance-mail-sender {
  grid-column: 1 / -1;
}

.maintenance-mail-sender-grid {
  grid-template-columns: minmax(0, 0.8fr) repeat(2, minmax(0, 1.1fr));
}

.maintenance-mail-section label {
  min-width: 0;
}

.maintenance-mail-section label > span:first-child,
.maintenance-mail-advanced label > span {
  display: block;
  margin-bottom: 0.3rem;
  color: #294862;
  font-size: 0.7rem;
  font-weight: 800;
}

.maintenance-mail-section input[type="text"],
.maintenance-mail-section input[type="email"],
.maintenance-mail-section input[type="password"],
.maintenance-mail-section input[type="number"],
.maintenance-mail-section select {
  box-sizing: border-box;
  width: 100%;
  min-height: 2.2rem;
  padding: 0.38rem 0.55rem;
  border: 1px solid #BFCEDC;
  border-radius: 9px;
  background: #FFFFFF;
  color: #17324D;
}

.maintenance-mail-section input:focus,
.maintenance-mail-section select:focus {
  border-color: #5D93AD;
  outline: 3px solid rgba(93, 147, 173, 0.15);
}

.maintenance-mail-auth.calendar-settings-switch {
  display: flex;
  margin: 0;
  padding: 0.5rem 0.6rem;
  border-radius: 9px;
  background: #F2F7F9;
  font-size: 0.72rem;
}

.maintenance-password-control {
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto;
  margin: 0 !important;
}

.maintenance-password-control input {
  border-radius: 9px 0 0 9px !important;
}

.maintenance-password-control button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 4.5rem;
  min-height: 2.2rem;
  padding: 0.35rem 0.6rem;
  border: 1px solid #BFCEDC;
  border-left: 0;
  border-radius: 0 9px 9px 0;
  background: #EEF4F7;
  color: #315A70;
  font-size: 0.68rem;
  font-weight: 800;
  cursor: pointer;
  white-space: nowrap;
}

.maintenance-mail-section small {
  display: block;
  margin-top: 0.3rem;
  color: #728594;
  font-size: 0.64rem;
  line-height: 1.35;
}

.maintenance-mail-advanced {
  margin-top: 0.6rem;
  border-top: 1px solid #E0E8ED;
}

.maintenance-mail-advanced summary {
  padding: 0.55rem 0 0.1rem;
  color: #476678;
  font-size: 0.68rem;
  font-weight: 800;
  cursor: pointer;
}

.maintenance-mail-advanced label {
  display: block;
  margin-top: 0.5rem;
}

.maintenance-card-heading {
  display: flex;
  align-items: flex-start;
  gap: 0.55rem;
  margin-bottom: 0.55rem;
}

.maintenance-card-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 2rem;
  width: 2rem;
  height: 2rem;
  border-radius: 8px;
  background: #EAF3FA;
  color: #2C6685;
  font-weight: 900;
}

.maintenance-card h2 {
  margin: 0 0 0.2rem;
  color: #1B4A62;
  font-size: 0.95rem;
}

.maintenance-card > label:not(.calendar-settings-switch),
.maintenance-logo-field > span,
.maintenance-animation-grid label > span {
  display: block;
  margin-bottom: 0.4rem;
  color: #294862;
  font-size: 0.78rem;
  font-weight: 800;
}

.maintenance-card input[type="text"],
.maintenance-card input[type="number"] {
  width: 100%;
  min-height: 2.15rem;
  padding: 0.35rem 0.55rem;
  border: 1px solid #BFCEDC;
  border-radius: 10px;
  background: #FDFEFF;
  color: #17324D;
}

.maintenance-logo-grid,
.maintenance-animation-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.65rem;
}

.maintenance-animation-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin-top: 0.65rem;
}

.maintenance-logo-field {
  display: grid;
  grid-template-columns: 4.5rem minmax(0, 1fr);
  align-items: center;
  gap: 0.45rem 0.6rem;
  padding: 0.55rem;
  border: 1px solid #E0E8EF;
  border-radius: 12px;
  background: #F8FAFC;
}

.maintenance-logo-field > span {
  grid-column: 1 / -1;
  margin-bottom: 0;
}

.maintenance-logo-preview {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 4.5rem;
  height: 3.4rem;
  margin: 0;
  border-radius: 8px;
  background: #FFFFFF;
}

.maintenance-logo-preview img {
  max-width: 4rem;
  max-height: 2.8rem;
  object-fit: contain;
}

.maintenance-file-button {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  min-height: 1.9rem;
  padding: 0.3rem 0.8rem !important;
  border: 0 !important;
  border-radius: 20px !important;
  background: #F3F4F6 !important;
  color: #1F2937 !important;
  box-shadow: 0 6px 14px rgba(107, 114, 128, 0.28) !important;
  cursor: pointer;
  justify-self: start;
}

.maintenance-file-button input[type="file"] {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}

.maintenance-card small {
  display: block;
  margin-top: 0.45rem;
  color: #718397;
}

.maintenance-actions {
  display: flex;
  justify-content: flex-end;
  gap: 0.6rem;
}

.maintenance-actions .button,
.maintenance-backup-button {
  min-height: 1.9rem;
  padding: 0.3rem 0.85rem !important;
  border: 0 !important;
  border-radius: 20px !important;
  background: #F3F4F6 !important;
  color: #1F2937 !important;
  box-shadow: 0 7px 16px rgba(107, 114, 128, 0.32) !important;
  font-weight: 800 !important;
}

.maintenance-backup-card form {
  display: flex;
  justify-content: flex-end;
}

.maintenance-backup-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 1rem;
}

.maintenance-backup-card .maintenance-card-heading {
  margin-bottom: 0;
}

/* Présentation unifiée, légère et cohérente avec les pages de réglages. */
.maintenance-header {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  position: relative;
  overflow: hidden;
  padding: 1rem 1.15rem;
  border-color: #D6E6F1;
  background: linear-gradient(125deg, #EAF5FF 0%, #F1EEFF 51%, #EAF9F1 100%);
  box-shadow: 0 7px 18px rgba(23, 50, 77, 0.07);
}

.maintenance-header::before {
  content: none;
}

.maintenance-title-icon {
  display: inline-flex;
  flex: 0 0 2.15rem;
  align-items: center;
  justify-content: center;
  width: 2.15rem;
  height: 2.15rem;
  border: 1px solid rgba(60, 140, 204, 0.22);
  border-radius: 11px;
  background: rgba(255, 255, 255, 0.82);
  color: #2F78AD;
  box-shadow: 0 5px 13px rgba(47, 120, 173, 0.14);
}

.maintenance-title-icon svg {
  width: 1.2rem;
  height: 1.2rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.maintenance-header > div {
  min-width: 0;
}

.maintenance-header h1 {
  margin: 0.08rem 0 0.2rem;
  font-size: 1.18rem;
  font-weight: 750;
  line-height: 1.25;
}

.maintenance-header p {
  font-size: 0.76rem;
}

.maintenance-kicker {
  color: #2F78AD;
  font-size: 0.62rem;
}

.maintenance-form {
  overflow: hidden;
  gap: 0;
  border: 1px solid #D7E5F1;
  border-radius: 14px;
  background: #FFFFFF;
  box-shadow: 0 9px 22px rgba(23, 50, 77, 0.08);
}

.maintenance-form .maintenance-card {
  padding: 0.85rem 1rem;
  border: 0;
  border-bottom: 1px solid #E3EBF2;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.maintenance-form .maintenance-card-heading p {
  font-size: 0.76rem;
}

.maintenance-identity-card .maintenance-card-icon {
  background: #EAF3FA;
  color: #2C6685;
}

.maintenance-logos-card .maintenance-card-icon {
  background: #E8F6F0;
  color: #26745C;
}

.maintenance-animation-card .maintenance-card-icon {
  background: #F1EDFA;
  color: #684EA5;
}

.maintenance-logo-field {
  border-color: #DFE9F0;
  background: #FAFCFD;
}

.maintenance-logo-preview {
  border: 1px solid #E5ECF2;
}

.maintenance-actions {
  margin: 0;
  padding: 0.7rem 1rem;
  border: 0;
  background: #F7FAFC;
}

.maintenance-backup-card {
  border-color: #F0D8BA;
  background: linear-gradient(110deg, #FFFBF5 0%, #FFFFFF 72%);
  box-shadow: 0 7px 18px rgba(139, 82, 21, 0.07);
}

.maintenance-backup-card .maintenance-card-icon {
  background: #FFF0DC;
  color: #B65A08;
}

.maintenance-backup-button {
  background: #FFF1DE !important;
  color: #A34C00 !important;
  box-shadow: 0 5px 12px rgba(198, 93, 0, 0.16) !important;
}

.maintenance-backup-button:hover,
.maintenance-backup-button:focus {
  background: #FFE2BD !important;
}

/* Nouvelle composition de la page de maintenance : sections lisibles et cartes autonomes. */
.maintenance-page {
  width: min(64rem, calc(100% - 2rem));
  margin-top: 1.25rem;
}

.maintenance-shell {
  gap: 1rem;
}

.maintenance-header {
  align-items: center;
  min-height: 5rem;
  padding: 1.1rem 1.25rem;
  border-color: #D8E5EC;
  background: linear-gradient(120deg, #F7FBFD 0%, #FFFFFF 58%, #F5FAF8 100%);
  box-shadow: 0 8px 24px rgba(31, 62, 82, 0.07);
}

.maintenance-header::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 4px;
  background: linear-gradient(180deg, #4384A4, #3FA17F);
}

.maintenance-title-icon {
  border-color: #D7E6ED;
  background: #FFFFFF;
  color: #347897;
  box-shadow: 0 5px 14px rgba(40, 101, 132, 0.12);
}

.maintenance-header h1 {
  font-size: 1.3rem;
  letter-spacing: -0.01em;
}

.maintenance-header p {
  max-width: 45rem;
  font-size: 0.78rem;
}

.maintenance-form {
  display: grid;
  gap: 1rem;
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}

.maintenance-group,
.maintenance-backup-area {
  display: grid;
  min-width: 0;
  gap: 0.65rem;
}

.maintenance-group-heading {
  display: flex;
  align-items: center;
  gap: 0.65rem;
  padding: 0 0.15rem;
}

.maintenance-group-heading > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 2rem;
  width: 2rem;
  height: 1.55rem;
  border-radius: 7px;
  background: #EAF3F7;
  color: #35718E;
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.04em;
}

.maintenance-group-heading h2 {
  margin: 0 0 0.08rem;
  color: #183D53;
  font-size: 0.9rem;
  line-height: 1.2;
}

.maintenance-group-heading p {
  margin: 0;
  color: #6B7F8E;
  font-size: 0.7rem;
  line-height: 1.35;
}

.maintenance-form .maintenance-card,
.maintenance-backup-card {
  padding: 0.9rem 1rem;
  border: 1px solid #DDE7ED;
  border-radius: 13px;
  background: #FFFFFF;
  box-shadow: 0 5px 16px rgba(32, 65, 85, 0.055);
}

.maintenance-form .maintenance-card:hover,
.maintenance-backup-card:hover {
  border-color: #CBDCE5;
  box-shadow: 0 7px 20px rgba(32, 65, 85, 0.075);
}

.maintenance-appearance-group {
  grid-template-columns: minmax(0, 1fr);
}

.maintenance-appearance-group > .maintenance-group-heading,
.maintenance-appearance-group > .maintenance-card {
  grid-column: 1;
}

.maintenance-identity-card {
  grid-template-columns: minmax(15rem, 0.75fr) minmax(22rem, 1.25fr);
}

.maintenance-animation-card {
  grid-template-columns: minmax(16rem, 0.7fr) minmax(28rem, 1.3fr);
}

.maintenance-animation-grid {
  transition: opacity 0.18s ease;
}

.maintenance-animation-grid.is-inactive {
  opacity: 0.48;
}

.maintenance-card-heading {
  gap: 0.65rem;
}

.maintenance-card-icon {
  flex-basis: 2.1rem;
  width: 2.1rem;
  height: 2.1rem;
  border-radius: 9px;
}

.maintenance-card h2 {
  font-size: 0.9rem;
}

.maintenance-card-heading p,
.maintenance-form .maintenance-card-heading p {
  font-size: 0.72rem;
}

.maintenance-card input[type="text"],
.maintenance-card input[type="email"],
.maintenance-card input[type="password"],
.maintenance-card input[type="number"],
.maintenance-card select {
  box-shadow: inset 0 1px 2px rgba(23, 50, 77, 0.025);
  transition: border-color 0.16s ease, box-shadow 0.16s ease;
}

.maintenance-card input:focus,
.maintenance-card select:focus {
  border-color: #5D93AD;
  outline: 0;
  box-shadow: 0 0 0 3px rgba(93, 147, 173, 0.14);
}

.maintenance-logo-field {
  padding: 0.65rem;
  border-radius: 10px;
  background: #F8FBFC;
}

.maintenance-file-button,
.maintenance-actions .button,
.maintenance-backup-button {
  border: 1px solid #D7E0E6 !important;
  background: #FFFFFF !important;
  color: #294B5E !important;
  box-shadow: 0 3px 8px rgba(40, 67, 82, 0.1) !important;
  transition: background 0.16s ease, border-color 0.16s ease, transform 0.16s ease, box-shadow 0.16s ease;
}

.maintenance-file-button > span {
  display: block;
  max-width: 12rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.maintenance-file-button:hover,
.maintenance-actions .button:hover,
.maintenance-backup-button:hover,
.maintenance-file-button:focus,
.maintenance-actions .button:focus,
.maintenance-backup-button:focus {
  border-color: #B8CBD6 !important;
  background: #F7FAFC !important;
  box-shadow: 0 5px 12px rgba(40, 67, 82, 0.14) !important;
  transform: translateY(-1px);
}

.maintenance-mail-card {
  border-top: 3px solid #E9B08D !important;
}

.maintenance-mail-sections {
  gap: 0.75rem;
}

.maintenance-mail-section {
  border-color: #E0E8ED;
  background: #FBFCFD;
}

.maintenance-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin: 0;
  padding: 0.8rem 1rem;
  border: 1px solid #DDE7ED;
  border-radius: 13px;
  background: #F7FAFB;
  box-shadow: 0 5px 14px rgba(32, 65, 85, 0.045);
}

.maintenance-actions > span {
  color: #667D8C;
  font-size: 0.7rem;
}

.maintenance-actions > div {
  display: flex;
  gap: 0.55rem;
}

.maintenance-actions .maintenance-save-button {
  border-color: #AFCFC4 !important;
  background: #F4FAF7 !important;
  color: #266C56 !important;
}

.maintenance-actions .maintenance-save-button:hover,
.maintenance-actions .maintenance-save-button:focus {
  border-color: #89B7A7 !important;
  background: #EAF6F0 !important;
}

/* Communication : cartes pleine largeur et commandes lisibles sur ordinateur. */
@media (min-width: 44.0625rem) {
  .maintenance-communication-group,
  .maintenance-mail-card,
  .maintenance-mail-sections,
  .maintenance-mail-section {
    overflow: visible;
  }

  .maintenance-mail-section {
    padding: 1rem;
  }

  .maintenance-mail-connection-grid > label,
  .maintenance-mail-credentials > label,
  .maintenance-mail-sender-grid > label {
    min-width: 0;
  }

  .maintenance-mail-section input[type="text"],
  .maintenance-mail-section input[type="email"],
  .maintenance-mail-section input[type="password"],
  .maintenance-mail-section input[type="number"],
  .maintenance-mail-section select {
    min-width: 0;
    min-height: 2.55rem;
    font-size: 0.82rem;
  }

  .maintenance-password-control button,
  .maintenance-actions .button {
    min-height: 2.55rem;
    box-sizing: border-box;
    padding: 0.55rem 0.9rem;
    line-height: 1.2;
    white-space: nowrap;
  }
}

.maintenance-backup-area > .maintenance-group-heading > span {
  background: #FFF1DF;
  color: #A85A13;
}

.maintenance-backup-card {
  border-color: #EBD9C4;
  background: linear-gradient(110deg, #FFFCF8 0%, #FFFFFF 75%);
}

.maintenance-backup-button {
  border-color: #E4CBAE !important;
  background: #FFF8EF !important;
  color: #9B5618 !important;
}

/* Organisation type « Paramètres » avec navigation et panneau de réglages. */
.maintenance-settings-layout {
  display: grid;
  grid-template-columns: 10.75rem minmax(0, 1fr);
  align-items: start;
  gap: 1rem;
}

.maintenance-settings-nav {
  position: sticky;
  top: 0.45rem;
  display: grid;
  gap: 0.25rem;
  padding: 0.65rem;
  border: 1px solid #DDE7ED;
  border-radius: 13px;
  background: #FFFFFF;
  box-shadow: 0 5px 16px rgba(32, 65, 85, 0.055);
}

.maintenance-settings-layout {
  grid-template-columns: 12.5rem minmax(0, 1fr);
}

.maintenance-settings-nav {
  position: sticky;
  top: 1rem;
}

/* Navigation des paramètres en bandeau supérieur. */
.maintenance-settings-layout {
  grid-template-columns: minmax(0, 1fr);
}

.maintenance-settings-nav {
  position: static;
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.35rem;
  width: 100%;
  box-sizing: border-box;
}

.maintenance-settings-nav > strong {
  margin-right: 0.35rem;
}

.maintenance-settings-nav a {
  flex: 0 1 auto;
}

@media (max-width: 44rem) {
  .maintenance-settings-nav {
    display: flex !important;
    flex-wrap: wrap;
  }

  .maintenance-settings-nav > strong {
    display: block;
    width: 100%;
  }
}

.maintenance-settings-nav > strong {
  padding: 0.3rem 0.45rem 0.45rem;
  color: #718491;
  font-size: 0.66rem;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.maintenance-settings-nav a {
  display: flex;
  align-items: center;
  gap: 0.55rem;
  min-height: 2.35rem;
  box-sizing: border-box;
  padding: 0.45rem 0.55rem;
  border-radius: 9px;
  color: #385568;
  font-size: 0.72rem;
  font-weight: 750;
  text-decoration: none;
  transition: background 0.16s ease, color 0.16s ease;
}

.maintenance-settings-nav a > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 1.65rem;
  width: 1.65rem;
  height: 1.65rem;
  border-radius: 7px;
  background: #EDF3F6;
  color: #4F7184;
  font-size: 0.65rem;
  font-weight: 900;
}

.maintenance-settings-nav a:hover,
.maintenance-settings-nav a:focus,
.maintenance-settings-nav a.is-active {
  background: #EAF4F7;
  color: #22647E;
}

.maintenance-settings-nav a:hover > span,
.maintenance-settings-nav a:focus > span,
.maintenance-settings-nav a.is-active > span {
  background: #FFFFFF;
  color: #2F7896;
}

.maintenance-settings-content {
  display: grid;
  min-width: 0;
  gap: 1rem;
}

.maintenance-settings-content [hidden] {
  display: none !important;
}

.maintenance-group,
.maintenance-backup-area {
  scroll-margin-top: 1rem;
  gap: 0;
  overflow: hidden;
  border: 1px solid #DDE7ED;
  border-radius: 13px;
  background: #FFFFFF;
  box-shadow: 0 5px 16px rgba(32, 65, 85, 0.055);
}

.maintenance-group-heading {
  padding: 0.85rem 1rem;
  border-bottom: 1px solid #E4EBF0;
  background: #F8FAFB;
}

.maintenance-group-heading > span {
  height: 2rem;
  border-radius: 8px;
  background: #E8F2F6;
  color: #33738F;
  font-size: 0.68rem;
  letter-spacing: 0;
}

.maintenance-group-heading h2 {
  font-size: 0.86rem;
}

.maintenance-form .maintenance-group > .maintenance-card,
.maintenance-backup-area > .maintenance-card {
  margin: 0;
  padding: 0.9rem 1rem;
  border: 0;
  border-bottom: 1px solid #E7EDF1;
  border-radius: 0;
  background: #FFFFFF;
  box-shadow: none;
}

.maintenance-form .maintenance-group > .maintenance-card:last-child,
.maintenance-backup-area > .maintenance-card:last-child {
  border-bottom: 0;
}

.maintenance-form .maintenance-group > .maintenance-card:hover,
.maintenance-backup-area > .maintenance-card:hover {
  border-color: #E7EDF1;
  background: #FCFDFE;
  box-shadow: none;
}

.maintenance-mail-card {
  border-top: 0 !important;
}

.maintenance-backup-area > .maintenance-group-heading > span {
  background: #FFF1DF;
  color: #A85A13;
}

.maintenance-actions {
  position: sticky;
  bottom: 0.65rem;
  z-index: 4;
  border-color: #CEDDE5;
  background: rgba(248, 251, 252, 0.96);
  backdrop-filter: blur(8px);
  box-shadow: 0 7px 20px rgba(32, 65, 85, 0.11);
}

@media (max-width: 44rem) {
  .maintenance-page {
    width: calc(100% - 1rem);
    margin-top: 0.75rem;
  }

  .maintenance-form,
  .maintenance-logo-grid,
  .maintenance-animation-grid,
  .maintenance-mail-sections,
  .maintenance-mail-connection-grid,
  .maintenance-mail-credentials,
  .maintenance-mail-sender-grid {
    grid-template-columns: minmax(0, 1fr);
  }

  .maintenance-mail-sender {
    grid-column: auto;
  }

  .maintenance-mail-status {
    margin-left: 0;
  }

  .maintenance-mail-card > .maintenance-card-heading {
    flex-wrap: wrap;
  }

  .maintenance-mail-card > .maintenance-card-heading .maintenance-mail-status {
    margin-left: 2.55rem;
  }

  .maintenance-identity-card,
  .maintenance-animation-card,
  .maintenance-backup-card {
    display: block;
  }

  .maintenance-identity-card .maintenance-card-heading,
  .maintenance-animation-card .maintenance-card-heading,
  .maintenance-identity-card > label,
  .maintenance-identity-card > input,
  .maintenance-animation-card > .calendar-settings-switch,
  .maintenance-animation-card .maintenance-animation-grid {
    grid-column: auto;
    grid-row: auto;
  }

  .maintenance-identity-card .maintenance-card-heading,
  .maintenance-animation-card .maintenance-card-heading,
  .maintenance-backup-card .maintenance-card-heading {
    margin-bottom: 0.55rem;
  }

  .maintenance-animation-card .maintenance-animation-grid {
    margin-top: 0.65rem;
  }

  .maintenance-backup-card form {
    margin-top: 0.65rem;
  }

  .maintenance-form .maintenance-card,
  .maintenance-actions {
    grid-column: 1;
  }

  .maintenance-header,
  .maintenance-card {
    padding: 0.65rem;
    border-radius: 12px;
  }

  .maintenance-header {
    gap: 0.6rem;
  }

  .maintenance-title-icon {
    flex-basis: 1.95rem;
    width: 1.95rem;
    height: 1.95rem;
  }

  .maintenance-form {
    border-radius: 12px;
  }

  .maintenance-form .maintenance-card {
    padding: 0.75rem;
    border-radius: 0;
  }

  .maintenance-actions {
    padding: 0.65rem 0.75rem;
  }

  .maintenance-logo-field {
    grid-template-columns: 4rem minmax(0, 1fr);
  }

  .maintenance-logo-preview {
    width: 4rem;
    height: 3rem;
  }

  .maintenance-logo-preview img {
    max-width: 3.5rem;
    max-height: 2.4rem;
  }

  .maintenance-actions .button,
  .maintenance-backup-button {
    min-height: 2.4rem;
  }

  .maintenance-group,
  .maintenance-backup-area {
    gap: 0.55rem;
  }

  .maintenance-group-heading {
    align-items: flex-start;
    padding: 0 0.1rem;
  }

  .maintenance-form .maintenance-card,
  .maintenance-backup-card {
    padding: 0.75rem;
    border-radius: 11px;
  }

  .maintenance-actions {
    align-items: stretch;
    flex-direction: column;
    gap: 0.6rem;
    border-radius: 11px;
  }

  .maintenance-actions > div {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .maintenance-actions .button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 100%;
  }

  .maintenance-backup-card form,
  .maintenance-backup-button {
    width: 100%;
  }

  .maintenance-settings-layout {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.65rem;
  }

  .maintenance-settings-nav {
    display: flex !important;
    flex-wrap: wrap;
  }

  .maintenance-settings-nav > strong {
    display: block;
    width: 100%;
  }

  .maintenance-settings-nav a {
    flex: 0 0 auto;
    min-height: 2.1rem;
    padding: 0.3rem 0.5rem;
    white-space: nowrap;
  }

  .maintenance-settings-nav a > span {
    width: 1.45rem;
    height: 1.45rem;
    flex-basis: 1.45rem;
  }

  .maintenance-settings-content {
    gap: 0.65rem;
  }

  .maintenance-settings-content [role="tabpanel"][hidden] {
    display: block !important;
  }

  .maintenance-settings-content .maintenance-actions[hidden] {
    display: flex !important;
  }

  .maintenance-group,
  .maintenance-backup-area {
    border-radius: 11px;
  }

  .maintenance-group-heading {
    padding: 0.7rem 0.75rem;
  }

  .maintenance-form .maintenance-group > .maintenance-card,
  .maintenance-backup-area > .maintenance-card {
    padding: 0.75rem;
    border-radius: 0;
  }

  .maintenance-actions {
    position: static;
  }
}

/* Priorité finale du nouveau formulaire utilisateur sur les anciens styles. */
.user-edit-page {
  overflow: hidden;
  padding: 0;
}

.user-edit-page form.standard#form_edit_users {
  padding: 1rem !important;
}

.user-edit-page form#form_edit_users > fieldset:not(:last-of-type) {
  padding: 0.85rem !important;
  border-color: #DCE8EF !important;
  background: rgba(255, 255, 255, 0.82) !important;
}

.user-edit-page form#form_edit_users > fieldset:not(:last-of-type) > legend {
  border: 0 !important;
  background: transparent !important;
  color: #1B4A62 !important;
  font-size: 0.82rem !important;
  font-weight: 800 !important;
}

.user-edit-page form#form_edit_users > fieldset:not(:last-of-type) > div:has(> input[type="checkbox"]) {
  grid-template-columns: minmax(0, 1fr) auto;
  min-height: 2.75rem;
  padding: 0.55rem 0.65rem;
  box-sizing: border-box;
  border: 1px solid #DDEBE4;
  border-radius: 10px;
  background: #F8FCFA;
}

.user-edit-page form#form_edit_users > fieldset:not(:last-of-type) > div:has(> input[type="password"]) {
  position: relative;
}

.user-edit-page form#form_edit_users > fieldset:not(:last-of-type) > div:has(> input[type="password"]) > label {
  grid-column: 1;
  grid-row: 1;
}

.user-edit-page form#form_edit_users > fieldset:not(:last-of-type) > div:has(> input[type="password"]) > input {
  grid-column: 2;
  grid-row: 1;
  padding-right: 3rem !important;
}

.user-edit-page form#form_edit_users > fieldset:not(:last-of-type) > div:has(> input[type="password"]) > div.eye {
  display: flex;
  grid-column: 2;
  grid-row: 1;
  align-self: center;
  justify-self: end;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.25rem;
  z-index: 2;
  color: #294862;
}

.user-edit-page form#form_edit_users div.eye svg {
  position: static;
  width: 2.35rem;
  height: 2.25rem;
  margin: 0;
  padding: 0.5rem;
  box-sizing: border-box;
  cursor: pointer;
}

@media (max-width: 44rem) {
  .user-edit-page {
    width: calc(100% - 1rem) !important;
    margin: 0.75rem auto 1.25rem !important;
    border-radius: 14px;
  }

  .user-edit-page .user-edit-header {
    gap: 0.6rem;
    padding: 0.8rem;
  }

  .user-edit-page .user-edit-header-icon {
    flex-basis: 1.95rem;
    width: 1.95rem;
    height: 1.95rem;
  }

  .user-edit-page .user-edit-header .user-edit-title {
    overflow-wrap: anywhere;
    font-size: 1.02rem !important;
  }

  .user-edit-page .user-edit-header p {
    overflow-wrap: anywhere;
    font-size: 0.7rem;
  }

  .user-edit-page form.standard#form_edit_users {
    padding: 0.75rem !important;
  }

  .user-edit-page form#form_edit_users > fieldset:not(:last-of-type) {
    min-width: 0 !important;
    margin-bottom: 0.65rem !important;
    padding: 0.7rem !important;
  }

  .user-edit-page form#form_edit_users > fieldset:not(:last-of-type) > legend {
    width: auto !important;
    margin-bottom: 0.45rem !important;
    padding: 0 !important;
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .user-edit-page form#form_edit_users > fieldset:not(:last-of-type) > div {
    min-width: 0;
    grid-template-columns: minmax(0, 1fr);
    gap: 0.3rem;
  }

  .user-edit-page form#form_edit_users label {
    max-width: 100%;
    line-height: 1.35;
    overflow-wrap: anywhere;
  }

  .user-edit-page form#form_edit_users input[type="text"],
  .user-edit-page form#form_edit_users input[type="email"],
  .user-edit-page form#form_edit_users input[type="password"],
  .user-edit-page form#form_edit_users input[type="number"],
  .user-edit-page form#form_edit_users select {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    min-height: 2.55rem;
    font-size: 1rem !important;
  }

  .user-edit-page form#form_edit_users > fieldset:not(:last-of-type) > div:has(> input[type="checkbox"]) {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: 0.6rem;
    min-height: 3rem;
    margin-bottom: 0.45rem;
  }

  .user-edit-page form#form_edit_users > fieldset:not(:last-of-type) > div:has(> input[type="password"]) > label {
    grid-column: 1;
    grid-row: 1;
  }

  .user-edit-page form#form_edit_users > fieldset:not(:last-of-type) > div:has(> input[type="password"]) > input {
    grid-column: 1;
    grid-row: 2;
  }

  .user-edit-page form#form_edit_users > fieldset:not(:last-of-type) > div:has(> input[type="password"]) > div.eye {
    grid-column: 1;
    grid-row: 2;
  }

  .user-edit-page form#form_edit_users .submit_buttons {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.55rem !important;
    padding: 0.7rem 0 0 !important;
  }

  .user-edit-page form#form_edit_users .submit_buttons > label,
  .user-edit-page form#form_edit_users .submit_buttons > input {
    width: 100% !important;
    min-width: 0 !important;
  }

  .user-edit-page form#form_edit_users .submit_buttons input[type="submit"] {
    width: 100% !important;
    min-height: 2.55rem !important;
    box-sizing: border-box !important;
  }
}

@media (max-width: 26rem) {
  .user-edit-page form#form_edit_users .submit_buttons {
    grid-template-columns: minmax(0, 1fr);
  }
}

/* Dernière priorité : actions calquées sur Ajouter une réservation. */
.user-edit-page form#form_edit_users .submit_buttons {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-end !important;
  flex-wrap: nowrap !important;
  gap: 0.6rem !important;
  margin: 0 !important;
  padding: 0 0.85rem 0 0 !important;
}

.user-edit-page form#form_edit_users .submit_buttons > label {
  display: inline-flex !important;
  align-items: center !important;
  flex: 0 0 auto !important;
  width: auto !important;
  height: 1.75rem !important;
  margin: 0 !important;
  padding: 0 !important;
}

.user-edit-page form#form_edit_users .submit_buttons input[type="submit"] {
  flex: 0 0 auto !important;
  width: auto !important;
  min-width: 0 !important;
  height: 1.75rem !important;
  min-height: 1.75rem !important;
  max-height: 1.75rem !important;
  margin: 0 !important;
}

@media (max-width: 44rem) {
  .user-edit-page form#form_edit_users .submit_buttons {
    display: flex !important;
    justify-content: flex-start !important;
    padding-right: 0 !important;
  }

  .user-edit-page form#form_edit_users .submit_buttons > label,
  .user-edit-page form#form_edit_users .submit_buttons > input,
  .user-edit-page form#form_edit_users .submit_buttons input[type="submit"] {
    width: auto !important;
    min-width: 0 !important;
  }
}

/* Une seule palette personnelle pour le calendrier, le profil et le compte. */
.banner nav.user-nav details.user-account-menu > summary.connected-user.user-colored-connected,
.banner nav.user-nav details.user-account-menu > summary.connected-user.user-colored-connected.admin-connected-user {
  border: 0 !important;
  background: var(--booking-user-chip) !important;
  color: var(--booking-user-text) !important;
  -webkit-text-fill-color: var(--booking-user-text) !important;
  box-shadow: 0 4px 12px color-mix(in srgb, var(--booking-user-border) 22%, transparent) !important;
  transform: translateY(0);
  transition: transform 0.16s ease, box-shadow 0.16s ease, background-color 0.16s ease;
}

.banner nav.user-nav details.user-account-menu > summary.connected-user.user-colored-connected:hover,
.banner nav.user-nav details.user-account-menu > summary.connected-user.user-colored-connected:focus {
  background: var(--booking-user-hover) !important;
  color: var(--booking-user-text) !important;
  -webkit-text-fill-color: var(--booking-user-text) !important;
  box-shadow: 0 9px 19px color-mix(in srgb, var(--booking-user-border) 36%, transparent) !important;
  transform: translateY(-2px);
}

.banner nav.user-nav details.user-account-menu > summary.connected-user.user-colored-connected:active {
  box-shadow: 0 4px 10px color-mix(in srgb, var(--booking-user-border) 24%, transparent) !important;
  transform: translateY(0);
}

.banner nav.user-nav details.user-account-menu > summary.connected-user.user-colored-connected::after {
  color: var(--booking-user-text) !important;
}

.banner nav.user-nav details.user-account-menu > summary.connected-user.user-colored-connected::before {
  background-color: var(--booking-user-text) !important;
  background-image: none !important;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='8' r='3' fill='none' stroke='black' stroke-width='2'/%3E%3Cpath fill='none' stroke='black' stroke-width='2' d='M5 20c.7-3.4 3.1-5 7-5s6.3 1.6 7 5'/%3E%3C/svg%3E") center / contain no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='8' r='3' fill='none' stroke='black' stroke-width='2'/%3E%3Cpath fill='none' stroke='black' stroke-width='2' d='M5 20c.7-3.4 3.1-5 7-5s6.3 1.6 7 5'/%3E%3C/svg%3E") center / contain no-repeat;
}

/* Accusé de prise en charge commun aux formulaires enregistrés. */
.global-save-processing {
  position: fixed;
  top: 1rem;
  left: 50%;
  z-index: 10000;
  display: flex;
  align-items: center;
  gap: 0.7rem;
  width: min(26rem, calc(100% - 2rem));
  padding: 0.75rem 0.9rem;
  box-sizing: border-box;
  transform: translateX(-50%);
  border: 1px solid #B9DEC9;
  border-radius: 13px;
  background: linear-gradient(125deg, #ECF9F2 0%, #F4FAFF 100%);
  color: #173F2E;
  box-shadow: 0 12px 28px rgba(23, 50, 77, 0.18);
  pointer-events: none;
}

.global-save-processing-icon {
  display: inline-flex;
  flex: 0 0 2rem;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  background: #249373;
  color: #FFFFFF;
  font-size: 1rem;
  font-weight: 900;
}

.global-save-processing-copy {
  display: grid;
  gap: 0.1rem;
  min-width: 0;
}

.global-save-processing-copy strong {
  color: #1F624B;
  font-size: 0.82rem;
}

.global-save-processing-copy span {
  color: #4F6F62;
  font-size: 0.72rem;
  line-height: 1.35;
}

@media (max-width: 44rem) {
  .global-save-processing {
    top: 0.6rem;
    width: calc(100% - 1rem);
    padding: 0.65rem 0.75rem;
  }
}

/* Publication contrôlée de la version de travail. */
.site-update-page { padding: clamp(0.8rem, 2vw, 1.5rem); }
.site-update-shell { width: min(100%, 70rem); margin: 0 auto; }
.site-update-header {
  display: flex; align-items: center; gap: 1rem; margin-bottom: 1rem;
  padding: clamp(1rem, 2.5vw, 1.6rem); border: 1px solid #dce9e3;
  border-radius: 18px; background: linear-gradient(135deg, #fff 0%, #f2faf6 100%);
}
.site-update-header h1 { margin: 0.12rem 0 0.25rem; color: #245f49; font-size: clamp(1.45rem, 3vw, 2rem); }
.site-update-header p { margin: 0; color: #577167; }
.site-update-title-icon {
  display: grid; flex: 0 0 3.1rem; place-items: center; width: 3.1rem; height: 3.1rem;
  border-radius: 15px; color: #fff; background: linear-gradient(135deg, #2f8062, #56aa87);
  font-size: 1.8rem; font-weight: 800;
}
.site-update-versions { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0.8rem; margin: 1rem 0; }
.site-update-versions article { padding: 1rem; border: 1px solid #e1e9e5; border-radius: 14px; background: #fff; }
.site-update-versions span, .site-update-versions strong { display: block; }
.site-update-versions span {
  margin-bottom: 0.25rem; color: #687c74; font-size: 0.78rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.045em;
}
.site-update-versions strong { color: #263f36; overflow-wrap: anywhere; }
.site-update-card { margin-top: 1rem; }
.site-update-counts { display: flex; flex-wrap: wrap; gap: 0.65rem; margin-top: 1rem; }
.site-update-counts span { padding: 0.55rem 0.8rem; border-radius: 999px; color: #315246; background: #edf7f2; }
.site-update-files { margin-top: 1rem; padding-top: 0.8rem; border-top: 1px solid #e2ebe7; }
.site-update-files summary { color: #286b52; cursor: pointer; font-weight: 700; }
.site-update-files ul { max-height: 18rem; overflow: auto; padding-left: 1.4rem; font: 0.84rem/1.55 ui-monospace, SFMono-Regular, Consolas, monospace; }
.site-update-files .change-added { color: #16804d; }
.site-update-files .change-modified { color: #b16c0a; }
.site-update-files .change-removed { color: #b54343; }
.site-update-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 0.7rem; margin: 1rem 0; }
.site-update-actions form { margin: 0; }
.site-update-actions .site-update-install { color: #fff; border-color: #267455; background: #2f8062; }
.site-update-actions .site-update-rollback { color: #9d5b00; border-color: #e4b66e; background: #fff8eb; }

.site-update-actions .site-update-install {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.45rem;
  min-height: 2.3rem !important;
  padding: 0.45rem 1rem !important;
  border: 1px solid #A93D36 !important;
  background: #C94D45 !important;
  color: #FFFFFF !important;
  box-shadow: 0 7px 16px rgba(169, 61, 54, 0.28) !important;
  font-weight: 850 !important;
}

.site-update-actions .site-update-install::before {
  content: "↥";
  font-size: 1rem;
  font-weight: 900;
  line-height: 1;
}

.site-update-actions .site-update-install:hover,
.site-update-actions .site-update-install:focus {
  border-color: #8F302A !important;
  background: #B63F38 !important;
  box-shadow: 0 9px 20px rgba(169, 61, 54, 0.36) !important;
  transform: translateY(-1px);
}

.site-update-single-content { display: grid; gap: 0.8rem; margin-top: 1rem; }
.site-update-panel { margin: 0; scroll-margin-top: 1rem; }
.site-update-panel > .maintenance-group-heading { background: #F8FAFB; }
.site-update-panel > .maintenance-group-heading > span { background: #E9F4EF; color: #287257; }
.site-update-versions { margin: 0; padding: 1rem; }
.site-update-versions article { background: #FAFCFB; }
.site-update-card {
  box-sizing: border-box;
  padding: 1rem;
  border: 1px solid #DDE7ED;
  border-radius: 13px;
  background: #FFFFFF;
  box-shadow: 0 5px 16px rgba(32, 65, 85, 0.055);
}
.site-update-card .maintenance-card-heading { margin-bottom: 0.6rem; }
.site-update-actions-panel .site-update-actions { margin: 0; padding: 1rem; }
.site-update-actions-panel .button {
  min-height: 1.9rem;
  padding: 0.3rem 0.85rem;
  border-radius: 20px;
  font-size: 0.74rem;
  font-weight: 800;
}
.site-update-header {
  min-height: 5rem;
  box-sizing: border-box;
  padding: 1.1rem 1.25rem;
  border-color: #D8E5EC;
  border-radius: 14px;
  background: linear-gradient(120deg, #F7FBFD 0%, #FFFFFF 58%, #F5FAF8 100%);
  box-shadow: 0 8px 24px rgba(31, 62, 82, 0.07);
}
.site-update-header h1 { color: #17324D; font-size: 1.3rem; }
.site-update-header p { color: #60758A; font-size: 0.78rem; }
.site-update-title-icon {
  flex-basis: 2.15rem;
  width: 2.15rem;
  height: 2.15rem;
  border: 1px solid #D7E6ED;
  border-radius: 11px;
  background: #FFFFFF;
  color: #347897;
  box-shadow: 0 5px 14px rgba(40, 101, 132, 0.12);
  font-size: 1.2rem;
}
.settings-submenu-site-update::before { content: "↥"; color: #b06400; font-weight: 900; }

/* Page de mise à jour simplifiée, dans la palette verte de la rubrique Dev. */
.site-update-shell {
  width: min(100%, 56rem);
}

.site-update-header {
  border-color: rgba(90, 177, 134, 0.38);
  background: linear-gradient(135deg, rgba(247, 255, 251, 0.86), rgba(221, 246, 233, 0.62));
  box-shadow: 0 10px 28px rgba(38, 117, 80, 0.1);
  -webkit-backdrop-filter: blur(12px) saturate(135%);
  backdrop-filter: blur(12px) saturate(135%);
}

.site-update-header h1 {
  color: #215F43;
}

.site-update-title-icon {
  border-color: rgba(90, 177, 134, 0.42);
  background: linear-gradient(135deg, rgba(230, 249, 239, 0.94), rgba(193, 232, 212, 0.78));
  color: #267550;
  box-shadow: 0 6px 16px rgba(38, 117, 80, 0.14);
}

.site-update-simple-content {
  display: grid;
  gap: 1rem;
  margin-top: 1rem;
}

.site-update-targets {
  display: grid;
  gap: 1.1rem;
  margin-top: 1rem;
}

.site-update-target {
  padding: 1rem;
  border: 1px solid rgba(90, 177, 134, 0.36);
  border-radius: 16px;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.88), rgba(231, 249, 240, 0.62));
  box-shadow: 0 9px 24px rgba(38, 117, 80, 0.09);
  -webkit-backdrop-filter: blur(11px) saturate(130%);
  backdrop-filter: blur(11px) saturate(130%);
}

.site-update-target-header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding-bottom: 0.85rem;
  border-bottom: 1px solid rgba(90, 177, 134, 0.24);
}

.site-update-target-header > span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.35rem;
  height: 2.35rem;
  flex: 0 0 2.35rem;
  border: 1px solid rgba(90, 177, 134, 0.38);
  border-radius: 11px;
  background: rgba(255, 255, 255, 0.74);
  color: #267550;
  font-size: 0.68rem;
  font-weight: 900;
}

.site-update-target-header h2 {
  margin: 0 0 0.16rem;
  color: #205F42;
  font-size: 1rem;
}

.site-update-target-header p {
  margin: 0;
  color: #5B7868;
  font-size: 0.72rem;
  line-height: 1.4;
}

.site-update-target .site-update-simple-content {
  margin-top: 0.9rem;
}

.site-update-global {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 0.9rem;
  padding: 1.4rem 0.4rem 0.4rem;
  text-align: center;
}

.site-update-global-versions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.45rem 1.2rem;
  margin: 0;
  color: #5A7666;
  font-size: 0.72rem;
}

.site-update-global-versions strong {
  margin-left: 0.25rem;
  color: #235F43;
  font-size: 0.76rem;
}

.site-update-global-copy h2 {
  margin: 0 0 0.25rem;
  color: #205F42;
  font-size: 1rem;
}

.site-update-global-copy p {
  margin: 0;
  color: #587565;
  font-size: 0.78rem;
  line-height: 1.45;
}

.site-update-global form {
  margin: 0;
}

.site-update-global .site-update-install-all {
  min-height: 2.65rem;
  padding: 0.6rem 1.35rem !important;
  border: 1px solid #1E6846 !important;
  border-radius: 999px;
  background: linear-gradient(135deg, #318A60, #216D49) !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  box-shadow: 0 9px 22px rgba(30, 104, 70, 0.28) !important;
  font-size: 0.84rem;
  font-weight: 900;
}

.site-update-global .site-update-install-all:hover,
.site-update-global .site-update-install-all:focus {
  background: linear-gradient(135deg, #287C55, #185D3D) !important;
  box-shadow: 0 11px 26px rgba(30, 104, 70, 0.36) !important;
  transform: translateY(-1px);
}

.site-update-global .site-update-global-rollback {
  margin-top: 0.25rem;
  padding-top: 0.85rem;
  border-top: 1px solid rgba(90, 177, 134, 0.22);
}

.site-update-global .site-update-rollback {
  min-height: 2rem;
  padding: 0.4rem 0.9rem;
  border: 1px solid rgba(45, 145, 94, 0.42) !important;
  border-radius: 999px;
  background: rgba(250, 255, 252, 0.9) !important;
  color: #267550 !important;
  -webkit-text-fill-color: #267550 !important;
  font-size: 0.74rem;
  font-weight: 800;
}

.site-update-simple-content .site-update-versions {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1rem;
  margin: 0;
  padding: 0;
}

.site-update-simple-content .site-update-versions article {
  min-height: 5.2rem;
  box-sizing: border-box;
  padding: 1rem 1.1rem;
  border: 1px solid rgba(90, 177, 134, 0.38);
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(255, 255, 255, 0.78), rgba(224, 246, 235, 0.54));
  box-shadow: 0 7px 20px rgba(38, 117, 80, 0.08);
  -webkit-backdrop-filter: blur(10px) saturate(130%);
  backdrop-filter: blur(10px) saturate(130%);
}

.site-update-simple-content .site-update-versions span {
  color: #397A5B;
  text-transform: none;
  letter-spacing: 0.02em;
}

.site-update-simple-content .site-update-versions strong {
  margin-top: 0.35rem;
  color: #173F2D;
  font-size: 1.05rem;
}

.site-update-availability,
.site-update-history {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr) auto;
  align-items: center;
  gap: 0.9rem;
  padding: 1rem 1.1rem;
  border: 1px solid rgba(90, 177, 134, 0.42);
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(246, 255, 250, 0.82), rgba(211, 241, 226, 0.58));
  box-shadow: 0 8px 22px rgba(38, 117, 80, 0.1);
  -webkit-backdrop-filter: blur(11px) saturate(135%);
  backdrop-filter: blur(11px) saturate(135%);
}

.site-update-availability.is-available {
  border: 2px solid rgba(45, 145, 94, 0.66);
  background: linear-gradient(135deg, rgba(235, 253, 244, 0.94), rgba(190, 235, 211, 0.72));
  box-shadow: 0 12px 30px rgba(38, 117, 80, 0.18);
}

.site-update-availability-icon,
.site-update-history-icon {
  display: grid;
  place-items: center;
  width: 2.5rem;
  height: 2.5rem;
  border: 1px solid rgba(64, 155, 109, 0.38);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.68);
  color: #267550;
  font-size: 1.3rem;
  font-weight: 900;
  box-shadow: 0 5px 14px rgba(38, 117, 80, 0.11);
}

.site-update-availability h2,
.site-update-history h2 {
  margin: 0 0 0.2rem;
  color: #205F42;
  font-size: 1rem;
}

.site-update-availability p,
.site-update-history p {
  margin: 0;
  color: #4E715F;
  font-size: 0.78rem;
  line-height: 1.45;
}

.site-update-availability form,
.site-update-history form {
  margin: 0;
}

.site-update-availability .site-update-install {
  min-height: 2.35rem;
  padding: 0.5rem 1.15rem;
  border: 1px solid #1E6846 !important;
  border-radius: 999px;
  background: linear-gradient(135deg, #318A60, #216D49) !important;
  color: #FFFFFF !important;
  -webkit-text-fill-color: #FFFFFF !important;
  box-shadow: 0 8px 20px rgba(30, 104, 70, 0.28) !important;
  font-size: 0.82rem;
  font-weight: 900;
  white-space: nowrap;
}

.site-update-availability .site-update-install::before {
  content: "↥";
  margin-right: 0.4rem;
}

.site-update-availability .site-update-install:hover,
.site-update-availability .site-update-install:focus {
  background: linear-gradient(135deg, #287C55, #185D3D) !important;
  box-shadow: 0 10px 24px rgba(30, 104, 70, 0.36) !important;
  transform: translateY(-1px);
}

.site-update-history {
  background: linear-gradient(135deg, rgba(252, 255, 253, 0.78), rgba(229, 246, 237, 0.5));
}

.site-update-history .site-update-rollback {
  min-height: 2rem;
  padding: 0.4rem 0.9rem;
  border: 1px solid rgba(45, 145, 94, 0.48) !important;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.68) !important;
  color: #267550 !important;
  -webkit-text-fill-color: #267550 !important;
  box-shadow: 0 5px 14px rgba(38, 117, 80, 0.1) !important;
  font-size: 0.76rem;
  font-weight: 850;
  white-space: nowrap;
}

.site-update-history .site-update-rollback:hover,
.site-update-history .site-update-rollback:focus {
  background: rgba(222, 246, 234, 0.88) !important;
  color: #1F6846 !important;
  -webkit-text-fill-color: #1F6846 !important;
}

.development-environment-banner {
  position: relative; z-index: 1000; padding: 0.45rem 1rem; color: #593900;
  background: #ffd987; text-align: center; font-size: 0.78rem; font-weight: 900; letter-spacing: 0.055em;
}
@media (max-width: 44rem) {
  .site-update-versions { grid-template-columns: 1fr; }
  .site-update-header { align-items: flex-start; }
  .site-update-actions, .site-update-actions form, .site-update-actions .button { width: 100%; }
  .site-update-single-content { gap: 0.6rem; margin-top: 0.65rem; }
  .site-update-versions { padding: 0.75rem; }
  .site-update-card { padding: 0.75rem; border-radius: 11px; }
  .site-update-actions-panel .site-update-actions { padding: 0.75rem; }
  .site-update-simple-content .site-update-versions { grid-template-columns: 1fr; }
  .site-update-availability,
  .site-update-history { grid-template-columns: auto minmax(0, 1fr); }
  .site-update-availability form,
  .site-update-history form { grid-column: 1 / -1; width: 100%; }
  .site-update-availability .button,
  .site-update-history .button { width: 100%; }
  .site-update-target { padding: 0.75rem; border-radius: 13px; }
  .site-update-global { padding-top: 1rem; }
  .site-update-global .site-update-install-all { width: 100%; }
}

/* Espace d'administration unifié. */
.administration-page {
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 1rem 1rem 2rem;
}

.administration-shell {
  width: min(100%, 72rem);
  margin: 0 auto;
}

.administration-header {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  min-height: 5rem;
  box-sizing: border-box;
  margin-bottom: 1rem;
  padding: 1.1rem 1.25rem;
  border: 1px solid #D8E5EC;
  border-radius: 14px;
  background: linear-gradient(120deg, #F7FBFD 0%, #FFFFFF 58%, #F5FAF8 100%);
  box-shadow: 0 8px 24px rgba(31, 62, 82, 0.07);
}

.administration-title-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 2.15rem;
  width: 2.15rem;
  height: 2.15rem;
  border: 1px solid #D7E6ED;
  border-radius: 11px;
  background: #FFFFFF;
  color: #347897;
  box-shadow: 0 5px 14px rgba(40, 101, 132, 0.12);
  font-size: 1rem;
}

.administration-header h1 {
  margin: 0.08rem 0 0.2rem;
  color: #17324D;
  font-size: 1.3rem;
  line-height: 1.25;
}

.administration-header p {
  margin: 0;
  color: #60758A;
  font-size: 0.78rem;
  line-height: 1.45;
}

.administration-settings-layout {
  grid-template-columns: 13.5rem minmax(0, 1fr);
}

.administration-settings-nav .administration-nav-subsection {
  display: inline-flex;
  align-items: center;
  gap: 0.45rem;
  margin: 0.4rem 0 0.12rem;
  padding: 0.48rem 0.62rem;
  border: 1px solid rgba(90, 177, 134, 0.28);
  border-radius: 8px;
  background: rgba(224, 246, 235, 0.58);
  color: #267550;
  box-shadow: none;
  font-size: 0.72rem;
  font-weight: 850;
  letter-spacing: 0.025em;
}

.administration-settings-nav .administration-nav-subsection-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.45rem;
  height: 1.45rem;
  flex: 0 0 1.45rem;
  border-radius: 7px;
  background: rgba(255, 255, 255, 0.66);
  color: #267550;
  font-size: 0.58rem;
  font-weight: 900;
  letter-spacing: -0.08em;
}

.administration-settings-nav a[data-section="maintenance"],
.administration-settings-nav a[data-section="maintenance"]:visited,
.administration-settings-nav a[data-section="update"],
.administration-settings-nav a[data-section="update"]:visited {
  margin-top: 0.14rem;
  margin-left: 0.7rem;
  border: 1px solid rgba(90, 177, 134, 0.18);
  background: linear-gradient(135deg, rgba(254, 255, 254, 0.98), rgba(244, 252, 248, 0.9));
  color: #267550;
  box-shadow: 0 3px 9px rgba(38, 117, 80, 0.035);
}

.administration-settings-nav a[data-section="maintenance"] > span,
.administration-settings-nav a[data-section="update"] > span {
  background: transparent;
  color: #267550;
}

.administration-settings-nav a[data-section="maintenance"]:hover,
.administration-settings-nav a[data-section="maintenance"]:focus,
.administration-settings-nav a[data-section="maintenance"].is-active,
.administration-settings-nav a[data-section="update"]:hover,
.administration-settings-nav a[data-section="update"]:focus,
.administration-settings-nav a[data-section="update"].is-active {
  border-color: rgba(90, 177, 134, 0.28);
  background: linear-gradient(135deg, #FBFEFC, #EDF9F2);
  color: #1F6846;
  box-shadow: 0 4px 11px rgba(38, 117, 80, 0.06);
}

.administration-settings-nav a[data-section="maintenance"]:hover > span,
.administration-settings-nav a[data-section="maintenance"]:focus > span,
.administration-settings-nav a[data-section="maintenance"].is-active > span,
.administration-settings-nav a[data-section="update"]:hover > span,
.administration-settings-nav a[data-section="update"]:focus > span,
.administration-settings-nav a[data-section="update"].is-active > span {
  background: transparent;
  color: #1F6846;
}

.administration-content {
  position: relative;
  min-width: 0;
  overflow: hidden;
  border: 1px solid #DDE7ED;
  border-radius: 13px;
  background: #FFFFFF;
  box-shadow: 0 5px 16px rgba(32, 65, 85, 0.055);
}

.administration-loading {
  position: absolute;
  z-index: 5;
  top: 0.75rem;
  left: 50%;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.45rem 0.7rem;
  border: 1px solid #D6E5EC;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.96);
  color: #486878;
  box-shadow: 0 5px 14px rgba(32, 65, 85, 0.12);
  font-size: 0.7rem;
  font-weight: 800;
  transform: translateX(-50%);
}

.administration-loading[hidden] {
  display: none !important;
}

.administration-loading > span {
  width: 0.75rem;
  height: 0.75rem;
  border: 2px solid #C5D8E1;
  border-top-color: #347897;
  border-radius: 50%;
  animation: administration-loading-spin 0.75s linear infinite;
}

@keyframes administration-loading-spin {
  to { transform: rotate(360deg); }
}

.administration-frame {
  display: block;
  width: 100%;
  min-height: 35rem;
  border: 0;
  background: #FFFFFF;
}

.settings-submenu-administration::before {
  content: "⚙";
  color: #A52A2A;
  font-weight: 900;
}

.messages-menu-button { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 2.35rem; height: 2.35rem; margin: 0 .3rem; border: 1px solid rgba(150, 59, 54, .28); border-radius: 50%; background: #fff7f5; color: #963b36; font-size: 1.2rem; text-decoration: none; box-shadow: 0 4px 12px rgba(91, 42, 38, .1); }
.messages-page { padding: 1.5rem 1.2rem 2.5rem; background: linear-gradient(180deg, #f8fbfa 0%, #fff 52%); }
.messages-shell { width: min(100%, 66rem); margin: 0 auto; }
.messages-header { position: relative; display: flex; align-items: center; gap: 1rem; overflow: hidden; padding: 1.45rem 1.55rem; border: 1px solid rgba(42, 100, 77, .18); border-radius: 22px; background: linear-gradient(120deg, #edf8f2 0%, #fff 62%, #fff8f4 100%); box-shadow: 0 14px 35px rgba(38, 83, 65, .1); }
.messages-header::after { position: absolute; right: -2.5rem; bottom: -3.7rem; width: 10rem; height: 10rem; border-radius: 50%; background: rgba(201, 120, 50, .1); content: ""; }
.messages-header h1 { margin: .25rem 0 .35rem; color: #285a47; font-size: clamp(1.25rem, 2.5vw, 1.75rem); letter-spacing: -.02em; }
.messages-header p { margin: 0; color: #60726a; }
.messages-icon { position: relative; z-index: 1; display: grid; place-items: center; flex: 0 0 auto; width: 3.2rem; height: 3.2rem; border-radius: 1.1rem; background: linear-gradient(145deg, #2f8062, #23634b); color: white; font-size: 1.55rem; box-shadow: 0 8px 18px rgba(35, 99, 75, .25); }
.messages-required { margin-top: 1rem; padding: 1rem 1.15rem; border: 1px solid rgba(150, 59, 54, .2); border-left: 5px solid #963b36; border-radius: 13px; background: linear-gradient(100deg, #fff4f2, #fffaf8); color: #71322f; font-weight: 700; box-shadow: 0 8px 20px rgba(150, 59, 54, .07); }
.message-compose, .message-list { margin-top: 1.15rem; padding: 1.3rem; border: 1px solid rgba(50, 92, 76, .13); border-radius: 18px; background: rgba(255, 255, 255, .95); box-shadow: 0 10px 28px rgba(35, 64, 52, .07); }
.message-compose h2, .message-list h2 { margin: 0 0 .8rem; color: #285a47; }
.message-compose label { display: block; margin: .65rem 0 .25rem; color: #3c5549; font-weight: 700; }
.message-compose input, .message-compose textarea { box-sizing: border-box; width: 100%; padding: .65rem .75rem; border: 1px solid #c9d8d0; border-radius: 9px; font: inherit; }
.message-compose textarea { min-height: 7rem; resize: vertical; }
.message-list-heading { display: flex; align-items: center; justify-content: space-between; gap: .75rem; padding-bottom: .75rem; border-bottom: 1px solid #e5eee9; }
.message-card { position: relative; margin-top: .85rem; padding: 1.15rem 1.2rem; border: 1px solid #dce8e2; border-radius: 15px; background: #fff; transition: transform .18s ease, box-shadow .18s ease; }
.message-card:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(35, 64, 52, .08); }
.message-card.is-unread { border-color: rgba(150, 59, 54, .28); border-left: 5px solid #963b36; background: linear-gradient(112deg, #fffafa, #fff); }
.message-card-top { display: flex; justify-content: space-between; gap: .5rem; color: #7b8881; font-size: .78rem; }
.message-state { display: inline-flex; align-items: center; gap: .3rem; color: #6b7e74; font-weight: 800; }
.message-state::before { display: inline-block; width: .42rem; height: .42rem; border-radius: 50%; background: #9bb0a5; content: ""; }
.is-unread .message-state { color: #963b36; }
.is-unread .message-state::before { background: #c45a51; }
.message-card h3 { margin: .45rem 0 .6rem; color: #285a47; font-size: 1.15rem; }
.message-body { color: #43564c; line-height: 1.7; white-space: normal; }
.message-author { margin: .8rem 0 .2rem; color: #7b8881; font-size: .78rem; }
.message-delete { margin-top: .55rem; color: #963b36; }
.message-empty { color: #6c7c74; }
@media (max-width: 44rem) { .messages-page { padding: .75rem .5rem 1.5rem; } .messages-header { align-items: flex-start; padding: 1rem; border-radius: 17px; } .messages-icon { width: 2.7rem; height: 2.7rem; border-radius: .9rem; } .message-list-heading { align-items: flex-start; flex-direction: column; } .message-compose, .message-list { padding: .9rem; border-radius: 14px; } .message-card { padding: .95rem; } }
@media (prefers-reduced-motion: reduce) { .message-card { transition: none; } .message-card:hover { transform: none; } }

/* Présentation professionnelle de la messagerie. */
.messages-page { padding: 2rem 1.25rem 3rem; background: #f3f6f5; }
.messages-shell { width: min(100%, 62rem); }
.messages-header { gap: 1.15rem; padding: 1.65rem 1.8rem; border: 1px solid #d9e4df; border-radius: 10px; background: #fff; box-shadow: 0 8px 24px rgba(31, 61, 49, .07); }
.messages-header::after { display: none; }
.messages-header h1 { color: #173f31; font-size: clamp(1.35rem, 2.7vw, 1.9rem); font-weight: 750; letter-spacing: -.025em; }
.messages-header p { color: #63736c; font-size: .94rem; }
.messages-icon { width: 3.35rem; height: 3.35rem; border-radius: .65rem; background: #1f5d48; box-shadow: none; font-size: 1.45rem; }
.messages-required { display: flex; align-items: flex-start; gap: .7rem; padding: 1rem 1.15rem; border: 1px solid #e6c8c4; border-left: 4px solid #a14c46; border-radius: 8px; background: #fff; color: #633633; font-size: .92rem; box-shadow: 0 5px 14px rgba(79, 44, 41, .05); }
.messages-required::before { flex: 0 0 auto; content: "À lire"; padding: .22rem .42rem; border-radius: 4px; background: #a14c46; color: #fff; font-size: .68rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.message-compose, .message-list { padding: 1.45rem; border: 1px solid #d9e4df; border-radius: 10px; box-shadow: 0 7px 20px rgba(31, 61, 49, .05); }
.message-compose h2, .message-list h2 { color: #173f31; font-size: 1.08rem; font-weight: 750; }
.message-list-heading { padding-bottom: .9rem; border-bottom: 2px solid #edf2f0; }
.message-card { margin-top: 1rem; padding: 1.2rem 1.35rem; border: 1px solid #dce5e1; border-radius: 8px; box-shadow: none; }
.message-card:hover { transform: none; box-shadow: 0 7px 17px rgba(31, 61, 49, .07); }
.message-card.is-unread { border: 1px solid #d7b1ad; border-left: 4px solid #a14c46; background: #fff; }
.message-card-top { padding-bottom: .55rem; border-bottom: 1px solid #edf2f0; }
.message-card h3 { margin: .7rem 0 .55rem; color: #1f5d48; font-size: 1.12rem; font-weight: 750; }
.message-body { color: #3e4d47; font-size: .95rem; line-height: 1.75; }
.message-author { padding-top: .65rem; border-top: 1px solid #edf2f0; color: #74827c; }
.message-card .button { margin-top: .8rem; border-radius: 5px; font-weight: 750; }
@media (max-width: 44rem) { .messages-page { padding: 1rem .5rem 2rem; } .messages-header { padding: 1.15rem; } .message-compose, .message-list { padding: 1rem; } }

/* Variante annonce / communiqué officiel. */
.messages-page { background: #eef2f7; }
.messages-header { border: 0; border-radius: 4px; background: linear-gradient(115deg, #183b56, #245d72); box-shadow: 0 10px 25px rgba(24, 59, 86, .18); }
.messages-header h1, .messages-header p, .messages-header .maintenance-kicker { color: #fff; }
.messages-header p { opacity: .82; }
.messages-header .maintenance-kicker { letter-spacing: .13em; opacity: .72; }
.messages-icon { border: 1px solid rgba(255, 255, 255, .35); background: rgba(255, 255, 255, .13); color: #fff; }
.messages-required { border: 0; border-radius: 4px; background: #fff; box-shadow: 0 7px 18px rgba(24, 59, 86, .08); }
.messages-required::before { background: #b24e43; }
.message-compose, .message-list { border: 0; border-radius: 4px; box-shadow: 0 7px 18px rgba(24, 59, 86, .07); }
.message-list-heading { border-bottom-color: #dce5ee; }
.message-card { overflow: hidden; margin-top: 1rem; padding: 0 1.25rem 1.2rem; border: 0; border-radius: 4px; background: #fff; box-shadow: 0 6px 16px rgba(24, 59, 86, .07); }
.message-card::before { display: block; height: 7px; margin: 0 -1.25rem 1rem; background: #2c7488; content: ""; }
.message-card.is-unread::before { background: #b24e43; }
.message-card.is-unread { border-left: 0; }
.message-card-top { border-bottom: 0; }
.message-state { text-transform: uppercase; letter-spacing: .08em; }
.message-card h3 { color: #183b56; font-size: 1.28rem; }
.message-body { color: #435361; line-height: 1.8; }
.message-author { border-top-color: #e4ebf1; }

/* Variante bulletin premium, plus chaleureuse. */
.messages-page { background: #f7f5f0; }
.messages-header { border: 1px solid #e9dfca; border-radius: 18px; background: #fffdf8; box-shadow: 0 12px 30px rgba(94, 72, 39, .09); }
.messages-header h1 { color: #4b3b26; font-family: Georgia, 'Times New Roman', serif; font-weight: 700; }
.messages-header p, .messages-header .maintenance-kicker { color: #806f58; }
.messages-icon { border: 1px solid #d8bd83; background: #b78a42; box-shadow: 0 6px 14px rgba(126, 87, 31, .2); }
.messages-required { border: 1px solid #ead7b4; border-left: 5px solid #b78a42; background: #fffdf8; color: #654f31; box-shadow: 0 6px 16px rgba(94, 72, 39, .06); }
.messages-required::before { background: #b78a42; }
.message-compose, .message-list { border: 1px solid #e9dfca; border-radius: 16px; background: #fffdf9; box-shadow: 0 9px 22px rgba(94, 72, 39, .06); }
.message-list-heading { border-bottom-color: #eee5d5; }
.message-card { border: 1px solid #eadfca; border-radius: 14px; background: #fffefa; box-shadow: 0 5px 14px rgba(94, 72, 39, .05); }
.message-card::before { height: 4px; margin: 0 -1.25rem 1rem; background: #c7a15f; }
.message-card.is-unread::before { background: #a85c4c; }
.message-card h3 { color: #59462c; font-family: Georgia, 'Times New Roman', serif; font-size: 1.3rem; }
.message-body { color: #5c5448; line-height: 1.85; }
.message-author { border-top-color: #eee5d5; color: #8b7d69; }

/* Variante communication interne, sans badge « À lire ». */
.messages-page { background: #f1f4f8; }
.messages-header { border: 1px solid #d9e2eb; border-radius: 12px; background: #fff; box-shadow: 0 8px 22px rgba(42, 65, 88, .08); }
.messages-header h1 { color: #223c56; font-family: inherit; font-weight: 750; }
.messages-header p, .messages-header .maintenance-kicker { color: #6b7c8d; }
.messages-icon { border: 0; border-radius: 12px; background: #3f6f9b; box-shadow: 0 7px 15px rgba(63, 111, 155, .2); }
.messages-required { display: block; border: 1px solid #d8e4ef; border-left: 4px solid #4b82b4; border-radius: 10px; background: #fafdff; color: #3f5870; box-shadow: 0 5px 14px rgba(42, 65, 88, .05); font-weight: 600; }
.messages-required::before { display: none; content: none; }
.messages-compose, .messages-list { border: 1px solid #d9e2eb; border-radius: 12px; background: #fff; box-shadow: 0 7px 18px rgba(42, 65, 88, .06); }
.message-list-heading { border-bottom-color: #e4ebf2; }
.message-card { border: 1px solid #dce5ed; border-radius: 10px; background: #fff; box-shadow: 0 5px 14px rgba(42, 65, 88, .05); }
.message-card::before { height: 3px; margin: 0 -1.25rem 1rem; background: #6d9bc4; }
.message-card.is-unread::before { background: #507da5; }
.message-card h3 { color: #274d70; font-family: inherit; font-size: 1.18rem; }
.message-body { color: #465b70; line-height: 1.75; }
.message-author { border-top-color: #e4ebf2; color: #758698; }

/* Variante professionnelle type portail d’entreprise. */
.messages-page { background: #f5f7f9; }
.messages-shell { width: min(100%, 68rem); }
.messages-header { display: grid; grid-template-columns: auto 1fr; gap: 1rem; align-items: center; border: 1px solid #dce3e9; border-radius: 6px; background: #172b3c; box-shadow: 0 10px 24px rgba(23, 43, 60, .16); }
.messages-header h1 { color: #fff; font-size: clamp(1.3rem, 2.5vw, 1.8rem); font-weight: 700; letter-spacing: -.015em; }
.messages-header p { color: #c7d3dc; }
.messages-header .maintenance-kicker { color: #71c5c3; font-weight: 800; }
.messages-icon { width: 3rem; height: 3rem; border: 1px solid rgba(113, 197, 195, .5); border-radius: 6px; background: #24505f; box-shadow: none; }
.messages-required { border: 1px solid #cddfe8; border-left: 4px solid #2a8794; border-radius: 6px; background: #fff; color: #304b5b; box-shadow: 0 5px 14px rgba(23, 43, 60, .05); }
.messages-compose, .messages-list { border: 1px solid #dce3e9; border-radius: 6px; background: #fff; box-shadow: 0 6px 16px rgba(23, 43, 60, .05); }
.message-list-heading { border-bottom: 2px solid #edf0f3; }
.message-card { border: 1px solid #dce3e9; border-radius: 6px; background: #fff; box-shadow: none; }
.message-card::before { height: 4px; margin: 0 -1.25rem 1rem; background: #2a8794; }
.message-card.is-unread::before { background: #2d718e; }
.message-state { color: #537080; font-size: .72rem; }
.message-card h3 { color: #183b56; font-size: 1.18rem; font-weight: 700; }
.message-body { color: #425765; line-height: 1.75; }
.message-card .button { border-radius: 4px; }
@media (max-width: 44rem) { .messages-header { grid-template-columns: auto 1fr; } }

/* Intégration à l’identité visuelle EspaceSt. */
.messages-page { background: #f7faf8; }
.messages-shell { width: min(100%, 70rem); }
.messages-header { display: flex; grid-template-columns: none; border: 1px solid rgba(47, 128, 98, .18); border-radius: 18px; background: linear-gradient(120deg, #eaf6ef 0%, #fff 65%, #f3faf6 100%); box-shadow: 0 12px 30px rgba(35, 99, 75, .1); }
.messages-header h1 { color: #245f49; font-size: clamp(1.3rem, 2.6vw, 1.85rem); font-weight: 750; }
.messages-header p { color: #607a6d; }
.messages-header .maintenance-kicker { color: #2f8062; }
.messages-icon { width: 3.15rem; height: 3.15rem; border: 0; border-radius: 1rem; background: linear-gradient(145deg, #2f8062, #23634b); box-shadow: 0 8px 18px rgba(35, 99, 75, .22); }
.messages-required { border: 1px solid rgba(47, 128, 98, .2); border-left: 5px solid #2f8062; border-radius: 12px; background: #fff; color: #315e4b; box-shadow: 0 7px 18px rgba(35, 99, 75, .06); }
.messages-compose, .messages-list { border: 1px solid rgba(47, 128, 98, .14); border-radius: 16px; background: #fff; box-shadow: 0 8px 22px rgba(35, 99, 75, .06); }
.message-list-heading { border-bottom-color: #e1eee7; }
.message-card { border: 1px solid #dcebe3; border-radius: 13px; background: #fff; box-shadow: 0 5px 15px rgba(35, 99, 75, .05); }
.message-card::before { height: 4px; margin: 0 -1.25rem 1rem; background: #5aa985; }
.message-card.is-unread::before { background: #c06a59; }
.message-card h3 { color: #285a47; font-size: 1.2rem; }
.message-body { color: #465d51; line-height: 1.75; }
.message-author { border-top-color: #e1eee7; color: #71877a; }

/* Variante valorisée et élégante, fidèle à EspaceSt. */
.messages-page { padding: 2rem 1.2rem 3rem; background: radial-gradient(circle at 8% 0%, #edf8f2 0, #f7faf8 34%, #fff 78%); }
.messages-header { position: relative; overflow: hidden; gap: 1.15rem; padding: 1.75rem 1.8rem; border: 1px solid rgba(47, 128, 98, .2); border-radius: 22px; background: linear-gradient(125deg, #e6f5ed 0%, #fff 54%, #fffaf2 100%); box-shadow: 0 16px 38px rgba(35, 99, 75, .12); }
.messages-header::before { position: absolute; right: -2rem; top: -4.5rem; width: 12rem; height: 12rem; border: 18px solid rgba(192, 150, 75, .12); border-radius: 50%; content: ""; }
.messages-header h1 { position: relative; color: #1e5b44; font-size: clamp(1.4rem, 2.8vw, 1.95rem); font-weight: 800; letter-spacing: -.03em; }
.messages-header p { position: relative; color: #607a6d; }
.messages-header .maintenance-kicker { position: relative; color: #a47735; font-weight: 850; letter-spacing: .12em; }
.messages-icon { position: relative; z-index: 1; display: grid; place-items: center; width: 3.7rem; height: 3.7rem; border: 2px solid #c79b55; border-radius: 50%; background: radial-gradient(circle at 35% 28%, #fffdf6 0, #f3e5c8 68%, #dfc28a 100%); color: #1f6148; box-shadow: 0 9px 20px rgba(126, 87, 31, .18), inset 0 0 0 4px rgba(255, 255, 255, .58); font-size: 1.55rem; line-height: 1; }

/* Refonte complète : la messagerie reprend les codes du site EspaceSt. */
.messages-page { min-height: calc(100vh - 8rem); padding: 1.35rem 1rem 2.5rem; background: #f7faf8; }
.messages-shell { width: min(100%, 72rem); margin: 0 auto; }
.messages-header { display: flex; align-items: center; gap: 1rem; padding: 1.25rem 1.4rem; border: 1px solid #d7e7de; border-left: 6px solid #2f8062; border-radius: 16px; background: #fff; box-shadow: 0 9px 25px rgba(35, 99, 75, .08); }
.messages-header::before, .messages-header::after { display: none; }
.messages-header h1 { margin: .15rem 0 .3rem; color: #245f49; font-size: clamp(1.25rem, 2.5vw, 1.7rem); font-weight: 800; letter-spacing: -.02em; }
.messages-header p { margin: 0; color: #64766c; font-size: .92rem; }
.messages-header .maintenance-kicker { color: #2f8062; font-size: .72rem; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.messages-icon { position: relative; z-index: auto; display: grid; place-items: center; flex: 0 0 auto; width: 3.25rem; height: 3.25rem; border: 0; border-radius: 50%; background: #2f8062; color: #fff; box-shadow: 0 7px 16px rgba(35, 99, 75, .22); font-size: 1.45rem; }
.messages-required { margin-top: 1rem; padding: .9rem 1rem; border: 1px solid #cfe6d9; border-left: 4px solid #2f8062; border-radius: 11px; background: #f4fbf7; color: #2b644d; box-shadow: none; font-size: .9rem; font-weight: 650; }
.messages-compose, .messages-list { margin-top: 1rem; padding: 1.15rem; border: 1px solid #d7e7de; border-radius: 15px; background: #fff; box-shadow: 0 8px 21px rgba(35, 99, 75, .055); }
.message-compose h2, .message-list h2 { margin: 0; color: #285a47; font-size: 1.04rem; font-weight: 800; }
.message-compose form { margin-top: .85rem; }
.message-compose label { color: #426353; font-size: .88rem; }
.message-compose input, .message-compose textarea { border-color: #cfe0d6; border-radius: 8px; background: #fbfdfc; }
.message-compose input:focus, .message-compose textarea:focus { border-color: #2f8062; outline: 3px solid rgba(47, 128, 98, .12); }
.message-list-heading { padding-bottom: .8rem; border-bottom: 1px solid #e1eee7; }
.message-card { margin-top: .75rem; padding: 1rem 1.05rem 1.1rem; border: 1px solid #dcebe3; border-radius: 12px; background: #fff; box-shadow: none; }
.message-card::before { height: 3px; margin: 0 -1.05rem 1rem; background: #8bc2a4; }
.message-card.is-unread::before { background: #c06a59; }
.message-card:hover { transform: translateY(-1px); box-shadow: 0 8px 18px rgba(35, 99, 75, .07); }
.message-card h3 { margin: .4rem 0 .5rem; color: #285a47; font-size: 1.1rem; font-weight: 800; }
.message-body { color: #4b6255; line-height: 1.7; }
.message-author { margin-top: .7rem; padding-top: .6rem; border-top: 1px solid #e1eee7; color: #789083; }
.message-card .button, .message-list-heading .button { border-radius: 7px; }
@media (max-width: 44rem) { .messages-page { padding: .75rem .5rem 1.5rem; } .messages-header { align-items: flex-start; padding: 1rem; border-left-width: 4px; border-radius: 13px; } .messages-icon { width: 2.75rem; height: 2.75rem; font-size: 1.25rem; } .messages-compose, .messages-list { padding: .9rem; border-radius: 12px; } }

/* Variante éditoriale, centrée et très aérée. */
.messages-page { padding: 2rem 1rem 3rem; background: linear-gradient(180deg, #f0f8f3 0, #f7faf8 30%, #fff 100%); }
.messages-header { display: block; padding: 1.8rem 1.5rem 1.55rem; border: 1px solid #d6e8dc; border-top: 5px solid #2f8062; border-left: 1px solid #d6e8dc; border-radius: 18px; text-align: center; }
.messages-icon { margin: 0 auto .8rem; width: 4rem; height: 4rem; border: 6px solid #eaf6ef; box-shadow: 0 7px 16px rgba(35, 99, 75, .2); font-size: 1.65rem; }
.messages-header h1 { margin: 0 0 .35rem; font-size: clamp(1.35rem, 2.7vw, 1.85rem); }
.messages-header p { max-width: 38rem; margin: 0 auto; }
.messages-required { max-width: 54rem; margin: 1.1rem auto 0; border: 1px solid #cfe6d9; border-radius: 12px; text-align: center; }
.messages-compose, .messages-list { border-radius: 18px; }
.message-list-heading { justify-content: center; padding-bottom: 1rem; text-align: center; }
.message-list-heading h2 { font-size: 1.15rem; }
.message-card { margin: .9rem auto 0; max-width: 56rem; padding: 1.25rem 1.35rem 1.3rem; border-radius: 15px; text-align: left; }
.message-card::before { height: 4px; margin: 0 -1.35rem 1.1rem; background: linear-gradient(90deg, #2f8062, #a8d5ba, #2f8062); }
.message-card h3 { font-size: 1.22rem; }
.message-body { font-size: .96rem; }

/* Variante boîte de réception moderne. */
.messages-page { padding: 1.25rem 1rem 2.5rem; background: #f7faf8; }
.messages-header { display: flex; align-items: center; gap: 1rem; padding: 1.15rem 1.3rem; border: 1px solid #d7e7de; border-left: 5px solid #2f8062; border-top: 1px solid #d7e7de; border-radius: 13px; text-align: left; }
.messages-icon { margin: 0; width: 3.2rem; height: 3.2rem; border: 0; border-radius: 50%; font-size: 1.4rem; }
.messages-header h1 { margin: .1rem 0 .2rem; font-size: clamp(1.2rem, 2.3vw, 1.55rem); }
.messages-header p { margin: 0; font-size: .87rem; }
.messages-required { max-width: none; margin-top: .85rem; text-align: left; }
.messages-list { padding: 1rem; }
.message-list-heading { justify-content: space-between; text-align: left; }
.message-list-heading h2 { font-size: 1.05rem; }
.message-card { max-width: none; margin: .75rem 0 0; padding: 1rem 1.05rem 1.1rem; border-radius: 11px; }
.message-card::before { margin: 0 -1.05rem .85rem; height: 3px; background: #71b491; }
.message-card h3 { font-size: 1.08rem; }
.message-body { font-size: .9rem; line-height: 1.65; }
@media (min-width: 52rem) { .message-list:not(:has(.message-empty)) { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .75rem; } .message-list > .message-list-heading { grid-column: 1 / -1; } .message-list > .message-card { margin: 0; } }

/* Refonte informatique : tableau de bord de communication. */
.messages-page { min-height: calc(100vh - 8rem); padding: 1.4rem 1rem 2.5rem; background: #101b25; color: #d7e5e2; font-family: Inter, ui-sans-serif, system-ui, sans-serif; }
.messages-shell { width: min(100%, 74rem); }
.messages-header { position: relative; display: flex; align-items: center; gap: 1rem; overflow: hidden; padding: 1.35rem 1.5rem; border: 1px solid #294453; border-left: 4px solid #5de0b1; border-radius: 8px; background: linear-gradient(120deg, #172b3a, #13232f); box-shadow: 0 12px 30px rgba(0, 0, 0, .2); text-align: left; }
.messages-header::after { position: absolute; right: 1.2rem; bottom: .6rem; color: rgba(93, 224, 177, .2); content: "01 / MSG"; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .72rem; letter-spacing: .14em; }
.messages-header h1 { position: relative; z-index: 1; margin: .15rem 0 .25rem; color: #f2fbf8; font-size: clamp(1.2rem, 2.5vw, 1.7rem); font-weight: 750; letter-spacing: -.02em; }
.messages-header p { position: relative; z-index: 1; margin: 0; color: #9cb4b1; font-size: .88rem; }
.messages-header .maintenance-kicker { position: relative; z-index: 1; color: #5de0b1; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .68rem; font-weight: 700; letter-spacing: .13em; text-transform: uppercase; }
.messages-icon { margin: 0; width: 3.2rem; height: 3.2rem; border: 1px solid #5de0b1; border-radius: 8px; background: #183c43; color: #5de0b1; box-shadow: inset 0 0 18px rgba(93, 224, 177, .12), 0 0 18px rgba(93, 224, 177, .08); font-size: 1.35rem; }
.messages-required { margin-top: .85rem; padding: .85rem 1rem; border: 1px solid #6d5353; border-left: 4px solid #ff9c78; border-radius: 7px; background: #2a2529; color: #ffd2c4; box-shadow: none; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .8rem; text-align: left; }
.messages-compose, .messages-list { margin-top: .9rem; padding: 1.1rem; border: 1px solid #294453; border-radius: 8px; background: #152632; box-shadow: 0 10px 25px rgba(0, 0, 0, .16); }
.message-compose h2, .message-list h2 { color: #dff7ef; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .95rem; letter-spacing: .02em; }
.message-list-heading { border-bottom-color: #294453; text-align: left; }
.message-card { margin-top: .75rem; padding: 1rem 1.05rem; border: 1px solid #294453; border-radius: 7px; background: #182c39; box-shadow: none; text-align: left; }
.message-card::before { height: 3px; margin: 0 -1.05rem .85rem; background: #36b98e; }
.message-card.is-unread::before { background: #ff9c78; }
.message-card-top { color: #7fa19b; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .7rem; }
.message-state { color: #5de0b1; }
.is-unread .message-state { color: #ffb098; }
.message-card h3 { color: #f1faf7; font-size: 1.08rem; }
.message-body { color: #b4c9c5; font-size: .9rem; line-height: 1.7; }
.message-author { border-top-color: #294453; color: #7fa19b; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .7rem; }
.message-compose label { color: #a9c6bf; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .78rem; }
.message-compose input, .message-compose textarea { border-color: #355463; border-radius: 5px; background: #0f1d27; color: #e5f5f1; }
.message-compose input:focus, .message-compose textarea:focus { border-color: #5de0b1; outline: 2px solid rgba(93, 224, 177, .16); }
.messages-page .button { border: 1px solid #3b8b76; border-radius: 5px; background: #1b5c4d; color: #e8fff7; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .78rem; }
.messages-page .button:hover { background: #25735e; }
.message-empty { color: #9cb4b1; }
@media (max-width: 44rem) { .messages-page { padding: .7rem .45rem 1.5rem; } .messages-header { padding: 1rem; } .messages-header::after { display: none; } .messages-icon { width: 2.75rem; height: 2.75rem; } .messages-compose, .messages-list { padding: .85rem; } }

/* Version sobre : une seule couleur d’accent, sans animation ni son. */
.messages-page { min-height: calc(100vh - 8rem); padding: 1.4rem 1rem 2.5rem; background: #fbf8f7; color: #514746; font-family: inherit; }
.messages-header { display: flex; align-items: center; gap: 1rem; padding: 1.25rem 1.4rem; border: 1px solid #eadedb; border-left: 4px solid #9a5b51; border-radius: 12px; background: #fff; box-shadow: 0 7px 18px rgba(108, 69, 63, .06); text-align: left; }
.messages-header::after { display: none; }
.messages-header h1 { margin: .15rem 0 .3rem; color: #65413d; font-size: clamp(1.2rem, 2.4vw, 1.6rem); font-weight: 750; letter-spacing: 0; }
.messages-header p { margin: 0; color: #82716e; font-size: .9rem; }
.messages-header .maintenance-kicker { color: #9a5b51; font-size: .7rem; font-weight: 800; letter-spacing: .08em; }
.messages-icon { margin: 0; width: 3.1rem; height: 3.1rem; border: 0; border-radius: 11px; background: #b07a36; color: #fff; box-shadow: 0 5px 12px rgba(126, 87, 31, .16); font-size: 1.35rem; }
.messages-required { margin-top: .85rem; padding: .85rem 1rem; border: 1px solid #d3e5da; border-left: 4px solid #2f8062; border-radius: 9px; background: #fff; color: #426353; box-shadow: none; font-size: .88rem; font-weight: 600; }
.messages-compose, .messages-list { margin-top: .9rem; padding: 1.1rem; border: 1px solid #dce7e1; border-radius: 12px; background: #fff; box-shadow: 0 6px 16px rgba(35, 99, 75, .045); }
.message-compose h2, .message-list h2 { color: #285a47; font-size: 1rem; font-weight: 750; }
.message-list-heading { border-bottom-color: #e4eee8; }
.message-card { margin-top: .7rem; padding: 1rem 1.05rem 1.1rem; border: 1px solid #dce7e1; border-radius: 10px; background: #fff; box-shadow: none; }
.message-card::before { height: 3px; margin: 0 -1.05rem .85rem; background: #2f8062; }
.message-card.is-unread::before { background: #2f8062; }
.message-card-top { color: #829189; font-size: .75rem; }
.message-state, .is-unread .message-state { color: #2f8062; }
.message-card h3 { color: #285a47; font-size: 1.08rem; }
.message-body { color: #506359; font-size: .92rem; line-height: 1.7; }
.message-author { border-top-color: #e4eee8; color: #829189; font-size: .75rem; }
.message-compose label { color: #50695a; font-size: .86rem; }
.message-compose input, .message-compose textarea { border-color: #cfdfd5; border-radius: 7px; background: #fbfdfc; color: #43564d; }
.message-compose input:focus, .message-compose textarea:focus { border-color: #2f8062; outline: 2px solid rgba(47, 128, 98, .12); }
.messages-page .button { border: 1px solid #2f8062; border-radius: 6px; background: #2f8062; color: #fff; font-family: inherit; font-size: .82rem; }
.messages-page .button:hover { background: #276e54; }
@media (max-width: 44rem) { .messages-page { padding: .75rem .5rem 1.5rem; } .messages-header { padding: 1rem; } .messages-icon { width: 2.7rem; height: 2.7rem; } .messages-compose, .messages-list { padding: .9rem; } }

.homepage-message { width: min(100% - 2rem, 72rem); margin: 1rem auto 1.25rem; padding: 1.15rem 1.25rem; border: 1px solid #dce7e1; border-left: 4px solid #2f8062; border-radius: 12px; background: #fff; box-shadow: 0 8px 20px rgba(35, 99, 75, .07); }
.homepage-message-heading { display: flex; align-items: center; gap: .75rem; padding-bottom: .75rem; border-bottom: 1px solid #e4eee8; }
.homepage-message-heading > div > span { color: #2f8062; font-size: .7rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.homepage-message-heading h2 { margin: .2rem 0 0; color: #285a47; font-size: 1.15rem; }
.homepage-message-icon { display: grid; place-items: center; width: 3.4rem; height: 3.4rem; color: #2f8062; font-size: 2rem; transform: rotate(-12deg); }
.homepage-message-body { margin-top: .85rem; color: #506359; line-height: 1.7; }
.homepage-message-read { margin-top: .9rem; }
@media (max-width: 44rem) { .homepage-message { width: calc(100% - 1rem); padding: .95rem; } }

/* Présentation plate : aucun bloc autour des contenus. */
.messages-page { padding: 1.25rem 1rem 2.5rem; background: #f7faf8; }
.messages-header { display: flex; padding: .9rem 0 1.05rem; border: 0; border-bottom: 1px solid #dce7e1; border-radius: 0; background: transparent; box-shadow: none; }
.messages-icon { width: 3rem; height: 3rem; }
.messages-required { margin: .9rem 0 0; padding: .65rem 0; border: 0; border-bottom: 1px solid #eadedb; border-radius: 0; background: transparent; color: #725e5a; box-shadow: none; }
.messages-compose, .messages-list { border-color: #eadedb; box-shadow: 0 6px 16px rgba(108, 69, 63, .045); }
.message-compose h2, .message-list h2 { color: #65413d; }
.message-list-heading { border-bottom-color: #f0e5e2; }
.message-card { border-color: #eadedb; }
.message-card::before { background: #c58a79; }
.message-card.is-unread::before { background: #9a5b51; }
.message-card h3 { color: #65413d; }
.message-body { color: #655956; }
.message-author { border-top-color: #f0e5e2; color: #95817d; }
.messages-page .button { border-color: #9a5b51; background: #9a5b51; }
.messages-page .button:hover { background: #814a42; }
.messages-header { border-left-color: #2f8062; }
.messages-header h1 { color: #285a47; }
.messages-header .maintenance-kicker { color: #2f8062; }
.messages-icon { width: 6.8rem; height: 6.8rem; border: 0; border-radius: 0; background: transparent; color: #2f8062; box-shadow: none; font-size: 4.3rem; transform: rotate(-12deg); }
@media (max-width: 44rem) { .messages-icon { width: 4.8rem; height: 4.8rem; font-size: 3rem; } }
.messages-compose, .messages-list { margin-top: 1rem; padding: .25rem 0 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.message-list-heading { padding: .65rem 0; border-bottom: 1px solid #dce7e1; }
.message-card { margin-top: 0; padding: 1rem 0; border: 0; border-bottom: 1px solid #dce7e1; border-radius: 0; background: transparent; box-shadow: none; }
.message-card::before { display: none; }
.message-card:hover { transform: none; box-shadow: none; }
.message-card.is-unread { border-left: 0; }
.message-card h3 { margin: .35rem 0 .45rem; }
.message-body { max-width: 58rem; }
.message-compose form { max-width: 52rem; }
.message-compose-help { margin: .45rem 0 .85rem; color: #718279; font-size: .8rem; line-height: 1.5; }
.message-read-help { margin: .8rem 0 0; color: #c5d0ca; font-size: .68rem; font-weight: 400; line-height: 1.45; }
.banner nav.user-nav details.user-account-menu .settings-submenu-messages::before { display: none; content: none; }
#administration-tab-messages > span { display: inline-block; margin-right: .35rem; color: #2f8062; transform: rotate(-12deg); }
.user-space-settings-nav #user-space-tab-messages > span { display: inline-block; margin-right: .35rem; color: #2f8062; transform: rotate(-12deg); }
.banner nav.user-nav details.user-account-menu .settings-submenu-messages::before { content: "✉"; display: inline-flex; align-items: center; justify-content: center; width: 1.35rem; margin-right: .35rem; color: #2f8062; font-size: .95rem; transform: rotate(-12deg); }
.banner nav.user-nav details.user-account-menu .settings-submenu-messages { background: transparent !important; border: 0 !important; box-shadow: none !important; }
.banner nav.user-nav details.user-account-menu a.settings-submenu-messages,
.banner nav.user-nav details.user-account-menu a.settings-submenu-messages:hover,
.banner nav.user-nav details.user-account-menu a.settings-submenu-messages:focus { background: none !important; background-color: transparent !important; border: 0 !important; box-shadow: none !important; }
.banner nav.user-nav details.user-account-menu a.settings-submenu-messages,
.banner nav.user-nav details.user-account-menu a.settings-submenu-messages:hover,
.banner nav.user-nav details.user-account-menu a.settings-submenu-messages:focus { color: inherit !important; -webkit-text-fill-color: inherit !important; }
.banner nav.user-nav details.user-account-menu .user-account-submenu a.settings-submenu-messages,
.banner nav.user-nav details.user-account-menu .user-account-submenu a.settings-submenu-messages:hover,
.banner nav.user-nav details.user-account-menu .user-account-submenu a.settings-submenu-messages:focus { background: transparent !important; background-color: transparent !important; color: inherit !important; -webkit-text-fill-color: inherit !important; }
.banner nav.user-nav details.user-account-menu .user-account-submenu a.settings-submenu-messages::before { content: "✉" !important; display: inline-flex !important; width: 1.35rem !important; height: auto !important; margin-right: .35rem !important; background: none !important; color: #2f8062 !important; font-size: .95rem !important; transform: rotate(-12deg); }
.messages-shell { width: 100%; max-width: none; }
.message-list { display: block !important; width: 100%; box-sizing: border-box; }
.message-card { display: block; width: 100%; max-width: none; min-width: 0; box-sizing: border-box; }
.messages-required { padding: 1rem 1.2rem; border: 1px solid rgba(192, 150, 75, .25); border-left: 5px solid #b58b47; border-radius: 14px; background: linear-gradient(105deg, #fffdf8, #fff); color: #5f5139; box-shadow: 0 8px 20px rgba(122, 92, 42, .07); }
.messages-compose, .messages-list { border: 1px solid rgba(47, 128, 98, .15); border-radius: 18px; box-shadow: 0 10px 28px rgba(35, 99, 75, .07); }
.message-list-heading { padding-bottom: 1rem; border-bottom: 1px solid #e2eee7; }
.message-card { padding: 1.2rem 1.3rem 1.3rem; border: 1px solid #dcebe3; border-radius: 15px; box-shadow: 0 8px 20px rgba(35, 99, 75, .06); }
.message-card::before { height: 5px; margin: 0 -1.3rem 1rem; background: linear-gradient(90deg, #2f8062, #8fc5a8); }
.message-card.is-unread::before { background: linear-gradient(90deg, #b65e4d, #e3a36f); }
.message-card h3 { color: #245f49; font-size: 1.25rem; font-weight: 800; }
.message-body { color: #405b4d; line-height: 1.8; }
.message-card .button { border-radius: 8px; box-shadow: 0 4px 10px rgba(35, 99, 75, .12); }

.banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-administration,
.banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-administration:visited {
  border-color: #E9C8C5 !important;
  background: #FFF1F0 !important;
  color: #963B36 !important;
  -webkit-text-fill-color: #963B36 !important;
}

.banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-administration:hover,
.banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-administration:focus {
  border-color: #DDAFAA !important;
  background: #FCE4E2 !important;
  color: #7E2E2A !important;
  -webkit-text-fill-color: #7E2E2A !important;
}

.settings-submenu-user-space::before {
  content: "" !important;
  display: inline-block !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='8' r='3' fill='none' stroke='%231F2937' stroke-width='1.8'/%3E%3Cpath d='M5 20c.7-3.4 3.1-5 7-5s6.3 1.6 7 5' fill='none' stroke='%231F2937' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") !important;
}

/* Navigation du compte : éléments supplémentaires réservés au mobile. */
.banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-mobile-only {
  display: none !important;
}

.settings-submenu-profile::before {
  content: "" !important;
  display: inline-block !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='8' r='3' fill='none' stroke='%231F2937' stroke-width='1.8'/%3E%3Cpath d='M5 20c.7-3.4 3.1-5 7-5s6.3 1.6 7 5' fill='none' stroke='%231F2937' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") !important;
}

.settings-submenu-admin-help::before {
  content: "?" !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  background-image: none !important;
  color: #963B36;
  font-size: 0.9em;
  font-weight: 900;
}

.settings-submenu-update::before {
  content: "↥" !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  background-image: none !important;
  color: #963B36;
  font-size: 1em;
  font-weight: 900;
}

.banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-mobile-category {
  display: none !important;
}

@media (max-width: 58rem) {
  .banner nav.user-nav details.user-account-menu .user-account-submenu {
    max-height: calc(100dvh - 6rem) !important;
    overflow-y: auto !important;
    overscroll-behavior: contain;
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-desktop-only {
    display: none !important;
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-mobile-only {
    display: flex !important;
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-mobile-category {
    align-items: center;
    min-height: 1.25rem;
    margin: 0.25rem 0 0;
    padding: 0.28rem 0.6rem;
    border: 1px solid #B9DDF3 !important;
    border-radius: 0.55rem;
    background: #DFF2FF !important;
    color: #1F2937 !important;
    -webkit-text-fill-color: #1F2937 !important;
    box-shadow: inset 4px 0 0 #4A9BC7;
    font-size: 0.68rem;
    font-weight: 850;
    letter-spacing: 0.045em;
    text-transform: uppercase;
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-mobile-category:first-child {
    margin-top: 0;
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-admin-category {
    margin-top: 0.55rem;
    border-color: #F1B8AD !important;
    background: #FFE3DC !important;
    color: #A33A2F !important;
    -webkit-text-fill-color: #A33A2F !important;
    box-shadow: inset 4px 0 0 #D96757;
    width: 100%;
    min-height: 1.25rem !important;
    box-sizing: border-box;
    padding: 0.28rem 0.6rem !important;
    font-family: inherit;
    font-size: 0.8rem !important;
    font-weight: 850 !important;
    line-height: normal !important;
    letter-spacing: 0.045em !important;
    text-transform: none !important;
    text-align: left;
    cursor: pointer;
    appearance: none;
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-admin-category::after {
    content: "▾";
    margin-left: auto;
    color: #A33A2F;
    font-size: 0.85rem;
    transition: transform 160ms ease;
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu:not(.admin-category-collapsed) .settings-submenu-admin-category::after {
    transform: rotate(180deg);
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu.admin-category-collapsed .settings-submenu-admin-mobile,
  .banner nav.user-nav details.user-account-menu .user-account-submenu.admin-category-collapsed .settings-submenu-admin-subcategory-mobile {
    display: none !important;
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-admin-subcategory {
    align-items: center;
    width: 100%;
    flex: 0 0 100%;
    grid-column: 1 / -1;
    min-height: 1.25rem !important;
    box-sizing: border-box;
    margin: 0.55rem 0 0;
    padding: 0.28rem 0.6rem !important;
    border: 1px solid rgba(90, 177, 134, 0.48) !important;
    border-radius: 0.55rem;
    background: linear-gradient(135deg, rgba(233, 250, 242, 0.78), rgba(211, 241, 226, 0.56)) !important;
    color: #267550 !important;
    -webkit-text-fill-color: #267550 !important;
    box-shadow: inset 4px 0 0 rgba(53, 151, 103, 0.82), 0 6px 16px rgba(38, 117, 80, 0.12);
    -webkit-backdrop-filter: blur(10px) saturate(135%);
    backdrop-filter: blur(10px) saturate(135%);
    font-family: inherit;
    font-size: 0.8rem !important;
    font-weight: 850 !important;
    line-height: normal !important;
    letter-spacing: 0.045em !important;
    text-align: left;
    cursor: pointer;
    appearance: none;
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-site-category {
    display: flex !important;
    grid-column: 1 / -1;
    width: 100%;
    flex: 0 0 100% !important;
    align-self: stretch;
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-admin-subcategory::after {
    content: "▾";
    margin-left: auto;
    color: #267550;
    font-size: 0.85rem;
    transition: transform 160ms ease;
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu:not(.site-category-collapsed) .settings-submenu-admin-subcategory::after {
    transform: rotate(180deg);
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu.site-category-collapsed .settings-submenu-site-mobile {
    display: none !important;
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-site-mobile {
    width: 100% !important;
    padding-left: 0.6rem !important;
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-admin-mobile,
  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-admin-mobile:visited {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #963B36 !important;
    -webkit-text-fill-color: #963B36 !important;
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-profile,
  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-my-reservations,
  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-help {
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #1F2937 !important;
    -webkit-text-fill-color: #1F2937 !important;
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-admin-mobile:hover,
  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-admin-mobile:focus {
    background: transparent !important;
    color: #742823 !important;
    -webkit-text-fill-color: #742823 !important;
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-maintenance,
  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-maintenance:visited {
    color: #E05206 !important;
    -webkit-text-fill-color: #E05206 !important;
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-maintenance:hover,
  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-maintenance:focus {
    color: #B83D00 !important;
    -webkit-text-fill-color: #B83D00 !important;
  }

  .banner nav.user-nav details.user-account-menu .settings-submenu-maintenance::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='3' fill='none' stroke='%23E05206' stroke-width='2'/%3E%3Cpath d='M12 2v3m0 14v3M2 12h3m14 0h3M4.9 4.9 7 7m10 10 2.1 2.1M19.1 4.9 17 7M7 17l-2.1 2.1' fill='none' stroke='%23E05206' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") !important;
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-profile:hover,
  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-profile:focus,
  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-my-reservations:hover,
  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-my-reservations:focus,
  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-help:hover,
  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-help:focus {
    background: transparent !important;
    color: #000000 !important;
    -webkit-text-fill-color: #000000 !important;
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-site-mobile,
  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-site-mobile:visited {
    width: 100% !important;
    margin-top: 0.18rem;
    padding: 0.32rem 0.6rem !important;
    border: 1px solid rgba(90, 177, 134, 0.34) !important;
    border-radius: 0.5rem !important;
    background: linear-gradient(135deg, rgba(255, 255, 255, 0.62), rgba(224, 246, 235, 0.46)) !important;
    color: #267550 !important;
    -webkit-text-fill-color: #267550 !important;
    box-shadow: 0 5px 14px rgba(38, 117, 80, 0.09) !important;
    -webkit-backdrop-filter: blur(9px) saturate(130%);
    backdrop-filter: blur(9px) saturate(130%);
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-site-mobile::before {
    color: #267550 !important;
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-site-mobile.settings-submenu-maintenance::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='3' fill='none' stroke='%23267550' stroke-width='2'/%3E%3Cpath d='M12 2v3m0 14v3M2 12h3m14 0h3M4.9 4.9 7 7m10 10 2.1 2.1M19.1 4.9 17 7M7 17l-2.1 2.1' fill='none' stroke='%23267550' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") !important;
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-site-mobile:hover,
  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-site-mobile:focus {
    box-shadow: 0 7px 17px rgba(38, 117, 80, 0.14) !important;
    color: #1F6846 !important;
    -webkit-text-fill-color: #1F6846 !important;
    filter: saturate(1.08);
  }
}

.settings-submenu-administration::before {
  content: "" !important;
  display: inline-block !important;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='3' fill='none' stroke='%23963B36' stroke-width='1.8'/%3E%3Cpath d='M12 2v3m0 14v3M2 12h3m14 0h3M4.9 4.9 7 7m10 10 2.1 2.1M19.1 4.9 17 7M7 17l-2.1 2.1' fill='none' stroke='%23963B36' stroke-width='1.8' stroke-linecap='round'/%3E%3C/svg%3E") !important;
}

.user-space-header {
  background: linear-gradient(120deg, #F7FBFD 0%, #FFFFFF 58%, #F4F9FC 100%);
}

.user-space-title-icon {
  color: #2F7896;
  font-size: 0.7rem;
}

.user-space-settings-nav a[data-section="profile"] > span {
  background: #EAF3F7;
  color: #2F7896;
}

.user-space-settings-nav a[data-section="bookings"] > span {
  background: #EAF6F0;
  color: #287257;
}

body.administration-embedded {
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #FFFFFF !important;
}

body.administration-embedded > .development-environment-banner,
body.administration-embedded > .banner,
body.administration-embedded > .site-credit,
body.administration-embedded > footer {
  display: none !important;
}

body.administration-embedded main.settings-page {
  box-sizing: border-box !important;
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0.65rem !important;
}

body.admin.administration-embedded {
  box-sizing: border-box !important;
  padding: 0.65rem !important;
}

body.administration-embedded .maintenance-page,
body.administration-embedded .calendar-settings-page,
body.administration-embedded .site-update-page {
  margin: 0 !important;
}

body.administration-embedded .maintenance-shell,
body.administration-embedded .calendar-settings-shell,
body.administration-embedded .site-update-shell {
  width: 100% !important;
  margin-top: 0 !important;
}

@media (max-width: 44rem) {
  .administration-page { padding: 0.8rem 0.5rem 1.25rem; }
  .administration-header { align-items: flex-start; margin-bottom: 0.65rem; padding: 0.8rem; border-radius: 12px; }
  .administration-header h1 { font-size: 1.05rem; }
  .administration-settings-layout { grid-template-columns: minmax(0, 1fr); }
  .administration-frame { min-height: 38rem; }
  body.administration-embedded main.settings-page { padding: 0.35rem !important; }
}

@media (min-width: 58.01rem) {
  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-site-category {
    display: flex !important;
    width: 100% !important;
    flex: 0 0 100% !important;
    align-self: stretch !important;
    box-sizing: border-box !important;
    align-items: center !important;
    gap: 0.45rem;
    min-height: 1.75rem !important;
    padding: 0.35rem 0.6rem !important;
    border: 1px solid rgba(90, 177, 134, 0.48) !important;
    border-radius: 0.55rem;
    background: linear-gradient(135deg, rgba(233, 250, 242, 0.78), rgba(211, 241, 226, 0.56)) !important;
    color: #267550 !important;
    -webkit-text-fill-color: #267550 !important;
    box-shadow: inset 4px 0 0 rgba(53, 151, 103, 0.82), 0 6px 16px rgba(38, 117, 80, 0.12);
    font-weight: 850 !important;
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu .settings-submenu-site-category::before {
    content: "</>";
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-width: 1.45rem;
    height: 1.45rem;
    border-radius: 0.4rem;
    background: rgba(255, 255, 255, 0.72);
    color: #267550;
    font-size: 0.62rem;
    font-weight: 900;
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu.site-category-collapsed .settings-submenu-site-mobile {
    display: none !important;
  }

  .banner nav.user-nav details.user-account-menu .user-account-submenu:not(.site-category-collapsed) .settings-submenu-site-mobile {
    display: flex !important;
    width: 100% !important;
    flex: 0 0 100% !important;
  }
}

/* Typographie et proportions alignées sur les formulaires du site. */
.messages-page{font-size:.9rem;line-height:1.45}.messages-header h1{font-size:1.3rem;font-weight:750;letter-spacing:0}.messages-header p{font-size:.78rem}.message-compose h2,.message-list h2{font-family:inherit !important;font-size:.92rem;line-height:1.3;letter-spacing:0}.message-compose-help{margin:.45rem 0 .9rem;font-size:.78rem;line-height:1.5}.message-compose label{display:block;margin:.7rem 0 .3rem;font-size:.78rem;font-weight:700;line-height:1.3}.message-compose input,.message-compose textarea{box-sizing:border-box;width:100%;min-height:2.3rem;padding:.55rem .65rem;font:inherit;font-size:.84rem;line-height:1.4}.message-compose textarea{min-height:7rem;resize:vertical}.messages-page .button{min-height:2.3rem;padding:.5rem .85rem;font-size:.78rem;font-weight:700;line-height:1.2}.message-card h3{margin:.35rem 0 .5rem;font-size:1.05rem;line-height:1.35}.message-body{font-size:.88rem;line-height:1.65}.message-author,.message-card-top{font-size:.72rem;line-height:1.4}.message-read-help{font-size:.68rem;line-height:1.45}
@media (max-width:44rem){.messages-header h1{font-size:1.15rem}.message-card h3{font-size:1rem}.message-body{font-size:.86rem}.message-compose input,.message-compose textarea{font-size:.82rem}}

/* Harmonisation finale de la page des annonces avec les pages du site. */
.messages-page{box-sizing:border-box;width:100%;max-width:none;min-height:0;margin:0;padding:1rem 1rem 2rem;background:#fffdf8;color:#344b5d;font-family:inherit}
.messages-shell{width:min(100%,72rem);margin:0 auto}
.messages-header{display:flex;align-items:center;gap:.8rem;min-height:5rem;box-sizing:border-box;margin-bottom:1rem;padding:1.1rem 1.25rem;border:1px solid #d8e5ec;border-left:0;border-radius:14px;background:linear-gradient(120deg,#f7fbfd 0%,#fff 58%,#f5faf8 100%);box-shadow:0 8px 24px rgba(31,62,82,.07);text-align:left}
.messages-header::after{display:none}.messages-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 2.15rem;width:2.15rem;height:2.15rem;margin:0;border:1px solid #d7e6ed;border-radius:11px;background:#fff;color:#347897;box-shadow:0 5px 14px rgba(40,101,132,.12);font-size:1rem;transform:none}
.messages-header h1{margin:.08rem 0 .2rem;color:#17324d;font-size:1.3rem;line-height:1.25}.messages-header p{margin:0;color:#60758a;font-size:.78rem;line-height:1.45}.messages-header .maintenance-kicker{color:#347897;font-size:.7rem;font-weight:800;letter-spacing:.08em}
.messages-compose,.messages-list{margin-top:1rem;padding:1.1rem 1.25rem;border:1px solid #d8e5ec;border-radius:14px;background:#fffefa;box-shadow:0 8px 24px rgba(31,62,82,.055)}
.message-compose h2,.message-list h2{color:#17324d;font-size:1rem;font-weight:750}.message-list-heading{padding-bottom:.75rem;border-bottom-color:#e1ebf0}.message-card{margin-top:.75rem;padding:1rem 1.05rem 1.1rem;border:1px solid #d8e5ec;border-radius:11px;background:#fbfdfe;box-shadow:none}.message-card::before{display:none}.message-card h3{color:#24536d;font-size:1.08rem}.message-body{color:#4e6574;font-size:.92rem;line-height:1.7}.message-author{border-top-color:#e1ebf0;color:#7b8d99}.message-compose label{color:#4e6574;font-size:.84rem}.message-compose input,.message-compose textarea{border-color:#cbdce5;border-radius:7px;background:#fbfdfe;color:#344b5d}.messages-page .button{border:1px solid #347897;border-radius:7px;background:#347897;color:#fff;font-family:inherit;font-size:.82rem}.messages-page .button:hover{background:#28647f}
@media (max-width:44rem){.messages-page{padding:.75rem .5rem 1.5rem}.messages-header{padding:1rem}.messages-compose,.messages-list{padding:.9rem}}