/*
 * Copyright (C) 2000 - 2024 Silverpeas
 *
 * This program is free software: you can redistribute it and/or modify
 * it under the terms of the GNU Affero General Public License as
 * published by the Free Software Foundation, either version 3 of the
 * License, or (at your option) any later version.
 *
 * As a special exception to the terms and conditions of version 3.0 of
 * the GPL, you may redistribute this Program in connection with Free/Libre
 * Open Source Software ("FLOSS") applications as described in Silverpeas's
 * FLOSS exception.  You should have received a copy of the text describing
 * the FLOSS exception, and it is also available here:
 * "http://www.silverpeas.org/docs/core/legal/floss_exception.html"
 *
 * This program is distributed in the hope that it will be useful,
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 * GNU Affero General Public License for more details.
 *
 * You should have received a copy of the GNU Affero General Public License
 * along with this program.  If not, see <https://www.gnu.org/licenses/>.
 */
#navigation {
  position: relative;
}

.titrePanier {
  margin: 0.25em;
  font-size: var(--font-size-titre);
  font-weight: var(--font-weight-titre);
  text-align: center;
}

div.hover {
  color: #666666;
  cursor: pointer;
}

div.selected {
  font-weight: bold;
  /* En gras */
}

.noRessource {
  font-style: italic;
  color: #666666;
}

#listeReservation {
  height: 200px;
  overflow: auto;
  padding: 10px;
  background-color: #FFFFFF;
  border: 1px solid #CCCCCC;
}

.selectedDataView {
  font-weight: bold;
}

.qtip {
  max-width: 400px;
}

.qtip-no-max-width .qtip {
  max-width: none;
}

.sousNavBulle #others {
  position: absolute;
  right: 0;
  top: 0;
  text-align: right;
}

.sousNavBulle #planning-context {
  background: #FFF url(../../../util/icons/user.png) 3px center no-repeat;
  padding: 0.5em 0.5em 0.5em calc(18px + 0.5em);
  color: #3a3a3a;
  display: inline-block;
  margin: 0.5em 0 0.5em;
  font-weight: 500;
  font-size: 0.9em;
}

.sousNavBulle #currentScope {
  margin: 0 0 0.5em 0;
}

.sousNavBulle #currentScope a {
  color: #AFAFAF;
  margin-right: 0.5em;
  padding: 0.5em;
}

.sousNavBulle #today a {
  background-color: #FAD163;
  color: #000000;
  padding: 0.5em 1em;
}

.sousNavBulle #currentScope a[href*="previousPeriod"] {
  margin-right: 0;
}

.sousNavBulle #currentScope a[href*="Period"] img{
  vertical-align: middle !important;
}

.sousNavBulle #today a:hover,
.sousNavBulle #today a:focus {
  background-color: #FFFFCC;
}

.sousNavBulle #others p {
  padding: 0;
}

.sousNavBulle .list-mode,
.sousNavBulle .calendar-mode {
  display: inline-block;
  width: 19px;
  height: 17px;
  vertical-align: middle;
}

.sousNavBulle .list-mode span,
.sousNavBulle .calendar-mode span {
  display: none;
}

.sousNavBulle .list-mode {
  background-image: url(../icons/list-mode.png);
  background-position: center center;
  background-repeat: no-repeat;
}

.sousNavBulle .calendar-mode {
  background-image: url(../icons/calendar-mode.png);
  background-position: center center;
  background-repeat: no-repeat;
}

.sousNavBulle .list-mode.active,
.sousNavBulle .list-mode:hover {
  background-image: url(../icons/list-mode-active.png);
  background-position: center center;
  background-repeat: no-repeat;
}

.sousNavBulle .calendar-mode.active,
.sousNavBulle .calendar-mode:hover {
  background-image: url(../icons/calendar-mode-active.png);
  background-position: center center;
  background-repeat: no-repeat;
}

#reservationList {
  clear: both;
}

#reservationList,
#reservationList ul,
#reservationList ul li {
  list-style-type: none;
  padding: 0;
  margin: 0;
  position: relative;
}

#reservationList ul li {
  border-bottom: 1px solid #EAEAEA;
  padding: 8px;
  z-index: 10;
  background-color: #FFF;
  display: block;
}

#reservationList ul ul li {
  border-bottom: 0;
  padding: 0;
  z-index: auto;
  background-color: transparent;
}

#reservationList ul li:hover {
  cursor: pointer;
  background-color: var(--bgColor-dossier-hover);
}

#reservationList ul li:hover hr.clear {
  color: #E8E8E8;
}

#reservationList .reservationPeriode {
  border-bottom: 1px solid #eaeaea;
  padding: 0.5em;
  margin: 0;
}

hr.clear {
  clear: both;
  height: 12px;
  margin: 0;
  padding: 0;
  border: 0;
  background-color: transparent;
  color: #FFF;
}

.reservationList h5 {
  color: var(--color-text-date);
  font-size: var(--font-size-titre);
  font-weight: var(--font-weight-titre);
  margin: 8px 0 0;
  padding: 0;
}

.reservationList h4,
.event-qtip h4 {
  margin: 0 0 8px;
  padding: 0;
}

.reservationList h4 a,
.event-qtip h4 a {
  color: var(--color-titre-avec-deux-couleurs);
  font-size: var(--font-size-titre);
}

.reservationDesc {
  color: var(--color-text-description);
  border-left: 3px solid #ececec;
  font-size: 0.9em;
  padding-left: 4px;
}

.reservationInfo {
  background-color: #EFEFEF;
  border: 1px solid #CDCDCD;
  border-radius: 15px 15px 15px 15px;
  display: table;
  padding: 8px 0;
  width: auto;
  position: absolute;
  top: 8px;
  right: 8px;
}

.reservationPlace .bloc {
  background: transparent url("../../../util/icons/marker.gif") 17px center no-repeat;
}

.reservationInfo div div.bloc {
  color: #333333;
  display: inline-block;
  font-size: 110%;
  padding: 0 22px 0 37px;
  text-align: left;
  width: auto;
}

#reservationList .reservationRessources,
#reservationList .reservationRessources li,
.event-qtip .reservationRessources li,
.event-qtip .reservationRessources {
  padding: 0;
  margin: 0;
}

#reservationList .reservationRessources li,
.event-qtip .reservationRessources li {
  display: inline;
  margin-right: 5px;
}

.reservationRessources li.validated a,
.resource.validated {
  background-color: #87bd41;
}

.reservationRessources li.refused a,
.resource.refused {
  background-color: #f15858;
  color: #FFF;
}

.reservationRessources li.waitingForValidation a,
.resource.waitingForValidation {
  background-color: #a7a7a7;
  color: #FFF;
}

.reservationRessources li a,
.resource {
  display: inline-block;
  margin-bottom: 0.5em;
  color: #FFF;
  border-radius: var(--radius-etiquette);
  padding: 0.25em 0.5em;
  z-index: 100;
  position: relative;
}

.reservationRessources li a:hover {
  color: #FFF;
  text-decoration: underline;
}

.event-qtip {
  padding: 0 3px 0 6px;
}

.event-qtip h4 {
  margin: 0 0 2px;
}

.event-qtip h4 a {
  font-size: 1em;
}

.event-qtip p.reservationPlace {
  background: url("../../../util/icons/marker.gif") left center no-repeat scroll transparent;
  padding: 1px 0 3px 20px;
  margin: 0;
}

.event-qtip .reservationDesc {
  margin: 2px 0 8px 0;
  padding: 0 0 0 4px;
}

.event-qtip .reservation-link {
  display: block;
  text-align: right;
  padding: 0.25em 0.5em;
  border-radius: var(--radius-btn-secondaire);
  color: var(--color-text-btn-secondaire);
  background: var(--bgColor-btn-secondaire);
  border: 1px solid var(--border-color-btn-secondaire);
}

.event-qtip .reservation-link:hover,
.event-qtip .reservation-link:focus {
  background: var(--bgColor-btn-secondaire-hover);
}

#legende {
  margin: 0;
  padding: 0;
  list-style-type: none;
  height: 24px;
}

#legende li {
  margin: 0;
  padding: 0;
  display: inline-block;
  margin-right: 18px;
  line-height: 20px;
}

#legende li .resource {
  width: 20px;
  margin-right: 9px;
  display: block;
  float: left;
  line-height: 14px;
}

#legendLabelId {
  cursor: pointer;
  float: right;
  padding-right: 38px;
  margin: -4px 0 4px;
}

.resource-info-extra {
  max-width: 750px;
  max-height: 600px;
  overflow: auto;
}

div.attachments {
  margin-left: 1em;
}