html {
   font-family: 'Montserrat';
}

body {
   margin: 0;
}
header {
   font-size: 0.7em;
   background: #f4f4f4;
   padding: 10px;
   /*! border-bottom: 1px solid #d9d9d9; */
}

h1 {
   margin: 0;
}

#context-div {
            /*! width: 50px; */
            /*! height: 50px; */
            /*! background-color: #eee; */
            position: absolute;
            pointer-events: none; /* Empêche d'interférer avec la souris */
            border-radius: 20px;
            box-shadow: 0 2px 30px #9b9b9b;
            backdrop-filter: blur(20px);
        }
#context-div li {
   list-style-type: none;
   margin: 10px 10px 20px;
   line-height: 2em;
}

#url-calendar {
   padding-top: 10px;
}
#url-calendar input {
   width: 5%;
   border: 1px solid #d9d9d9;
   border-radius: 3px;
}
#url-calendar .url {
   width: 90%;
   color: #8a8a8a;
}
#url-calendar .url:focus {
   color: #000;
}

h1 {
  margin-bottom: 0;
}

ul, li {
   margin: 0;
   padding: 0;
}

menu {
   float: left;
   width: 300px;
   margin-right: 20px;
   padding: 0;
}
menu ul {
   list-style-type: none;
}
menu li {
  font-weight: normal;
}
menu li:hover {
   background-color: #eee;
}

menu .course_title {
   display: block;
   font-weight: bold;
   margin-bottom: 3px;
}

menu .course_promo, menu .course_volume {
   padding: 2px 4px;
}
menu .course_promo {
  border: 1px solid grey;
  border-radius: 4px;
}

menu .calendar_promo .course_title, menu .calendar_groupe .course_title {
   display: inline-block;
}
menu .calendar_promo .course_promo, menu .calendar_groupe .course_promo {
   display: none;
}

content {
   display: block;
   margin-left: 320px;
}

content .mois {
   display: inline-block;
   border: 1px solid grey;
   margin: 10px;
   text-align: center;
   border-radius: 15px;
   /*! width: 220px; */
}

.mois td {
   transition: all 0.5s;
   border: 1px solid transparent;
   border-radius: 5px;
   padding: 4px 1px;
}

.vol-2 {
   background-color: rgba(10,10,10,0.1);
}
.vol-3 {
   background-color: rgba(10,10,10,0.2);
}
.vol-4 {
   background-color: rgba(10,10,10,0.3);
}
.vol-5 {
   background-color: rgba(10,10,10,0.4);
}
.vol-6 {
   background-color: rgba(10,10,10,0.5);
}
.vol-7 {
   background-color: rgba(10,10,10,0.6);
}
.vol-8 {
   background-color: rgba(10,10,10,0.7);
}
.vol-9 {
   background-color: rgba(10,10,10,0.1);
}
.vol-10, .vol-11, .vol-12, .vol-13, .vol-14, .vol-15  {
   background-color: rgba(10,10,10,1);
}

.mois td.selected {
   background: #f7ff07;
   border-color: #cec314;
}

#details>ul>li {
   display: none;
   margin: 5px 15px;
}
#details ul li.selected {
   display: inline-block;
}

#details>ul>li li {
   line-height: 2.5em;
   list-style-type: none;
   margin: 10px 0px;
   padding: 0 10px;
}

#details h4 {
  padding: 5px;
  background: #dedede;
  color: #000;
  padding: 4px 10px;
}

.date, .time, .location, .teacher,  .long, .equipment, .location_type {
   border: 1px solid transparent;
   border-radius: 5px;
   padding: 4px 10px;
}
.equipment span {
   padding: 2px 4px;
   border-radius: 5px;
   background: #dedede;
   font-weight: thin;
   font-size: 0.7em;
}
.date {
   border-color: #00b7ff;
   background-color: #d0fbff;
}
.time {
   border-color: #ffa700;
   background-color: #fdebc1;
}
.location {
   border-color: #c02bcc;
   background-color: #f0c4fd;
}
.teacher {
   border-color: #5ebb00;
   background-color: #daffae;
}
.long {
   border-color: #d2bf1d;
   background-color: #fffcce;
}
.location_type {
   border-color: #2b385e;
   background-color: #b1ccff;
   margin: 0 2px;
}
.AMPHI {
   border-color: #64360d;
   background-color: #5b93db;
}
.SALLE_COURS {
   background-color: #b1edff;
}
.SALLE_PC, .SALLE_MAC {
   background-color: #dbdbdb;
}
.STUDIO_SON, .STUDIO_VIDEO {
   border-color: #d21d58;
   background-color: #ffb1cb;
}

ul.events li {
   border-radius: 5px;
   padding: 4px 5px;
   font-size: 0.7em;
}

ul.events li.selected {
   background: #f7ff07;
   border-color: #cec314;
}

h4 {
  margin: 15px 0 5px 0;
}
.days_names {
  font-size: 0.5em;
}
.mois table {
  width: 220px;
}
#autre p.invalid {
    color: #c4c4c4;
    margin: 0;
    font-style: italic;
    line-height: 1em;
}

#gantt table {
   /*! clear: both; */
   border-collapse:collapse;
   font-size: 0.8em;
   margin: 8px;
}
#gantt td {
   border: 1px solid #dedede;
   padding: 5px;
   text-align: center;
   min-width: 20px;
}

#gantt td.course {
   text-align: left;
}

.cache {
   display: none !important;
}

.planning_recap {
   border-collapse: collapse;
}
.planning_recap td {
   border: 1px solid #dedede;
}
.planning_recap td span {
   border-collapse: collapse;
   border: none;
   background: initial;
   margin: initial;
   padding: initial;
}

.planning_recap thead {
   background-color: #dedede;
   padding: 4px 10px;
}


/* Onglets */
.tabs {
    display: flex;
    cursor: pointer;
    background-color: #f4f4f4;
    padding: 8px 8px 0;
    margin: 0;
    list-style: none;
}

.tab {
    padding: 5px 10px 4px;
    border: 1px solid #ccc;
    border-bottom: none;
    margin-right: 5px;
   font-size: 0.8em;
    background-color: #f0f0f0;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}

.tab.active {
    background-color: #ffffff;
    border-bottom: 1px solid #ffffff;
    font-weight: bold;
}

.tab-content {
    display: none;
    /*! padding: 20px; */
    /*! border: 1px solid #ccc; */
    background-color: #ffffff;
}

.tab-content.active {
    display: block;
}

.draggable-table-container {
    width: 100%;
    overflow: hidden; /* Cache les débordements */
    border: 1px solid #ccc;
    position: relative;
    cursor: grab; /* Affiche une icône de "main" */

    -webkit-user-select: none; /* Pour les navigateurs WebKit (Chrome, Safari) */
    -moz-user-select: none;    /* Pour Firefox */
    -ms-user-select: none;     /* Pour Internet Explorer/Edge */
    user-select: none;         /* Standard moderne */
}

/* Table de base */
#gantt table {
    border-collapse: collapse;
    width: 100%;
    height: auto;
    position: relative;
}

#gantt table th, table td {
    padding: 10px;
    border: 1px solid #ddd;
    text-align: left;
    white-space: nowrap; /* Empêche les cellules de se plier */
}

/* Figer la première colonne */
#gantt table th:first-child,
#gantt table td:first-child {
    position: sticky;
    left: 0;
    background-color: #f9f9f9; /* Couleur de fond pour coller au style */
    z-index: 2; /* S'assurer que cela reste au-dessus des autres cellules */
}

/* Figer la première ligne */
#gantt table thead th {
    position: sticky;
    top: 0;
    background-color: #f1f1f1; /* Couleur de fond */
    z-index: 3; /* S'assurer que cela reste au-dessus de la première colonne */
}

/* Style pour une meilleure lisibilité */
#gantt table thead th:first-child {
    z-index: 4; /* Priorité plus élevée pour l'intersection */
}

#gantt td.thisweek {
   background-color: #f0f0f0;
}
#gantt td.checked {
   background-color: #ffcb00;
   color: #b59311;
   position: relative;
}
#gantt td.checked.last_seance {
   background-color: #ff7800;
   color: #b55611;
}