/*
| *************************************
|
| ISPSO-CAL4 - Core CSS
| Author: Yann MANET <yann.manet@unige.ch>
| University of Geneva - CH
|
|****************************************
*/
/*
| ---------------------------------------
| Tags html
| ---------------------------------------
*/
html,
body {
    height: 100vh;
    width: 100%;
    overflow-x: hidden;
    overflow-y: auto;
}

body {
    margin: 0;
    padding: 0 10px 10px;
    /*font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
    font-serif	font-family: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
    font-mono	font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;*/
    font-size: 14px;
}

body[data-theme="dark"] {
    background-color: #1d2124 !important;
    color: #ffffff !important;
}

hr.title-gradient-border {
    background: linear-gradient(to right, #a7d1ff, transparent);
    border-top: 0;
    height: 1px;
}

a:hover {
    text-decoration: none;
}

/*
| ---------------------------------------
| Générique
| ---------------------------------------
*/
.cal4-logo {
    width: 32px;
    height: 32px;
}

.cursor-pointer {
    cursor: pointer !important;
}

.app-title-row {
    background-color: #163b61 !important;
    color: #fff !important;
}

.app-title-row .unige-logo {
    width: 140px;
    height: 55px;
    margin-right: 10px;
    background-image: url("../img/logo/unige.svg");
    background-repeat: no-repeat;
    background-size: 100% 100%;
}

.app-title-row a {
    color: #FFFFFF;
}

.app-title-row .cal4-main-title {
    font-size: 1rem;
    padding-top: .8rem
}

/*
| ---------------------------------------
| autoCompleteJS
| ---------------------------------------
*/
.autoComplete_wrapper {
    width: 100% !important;
}

.autoComplete_wrapper > input {
    height: calc(1.5em - -0.5rem - -2px) !important;
    width: 100% !important;
}

.autoComplete_wrapper > ul > li mark {
    background-color: transparent;
    color: #ff7a7a;
    font-weight: normal;
    padding: 0;
}

.autoCompleteJS_listInfo {
    color: grey;
    padding: 2px 5px;
}

/*
| ---------------------------------------
| Tooltip
| ---------------------------------------
*/
.tooltip-inner {
    max-width: 500px !important;
    font-size: 9pt;
}

html[data-theme="light"] .tooltip-inner {
    background: #e9ecef;
    color: #495057;
}

html[data-theme="light"] .bs-tooltip-auto[x-placement^=bottom] .arrow::before,
html[data-theme="light"] .bs-tooltip-bottom .arrow::before {
    border-bottom-color: #e9ecef;
}

/*
| ---------------------------------------
| breadcrumb
| ---------------------------------------
*/
.breadcrumb a:hover::after {
    width: 100%;
    opacity: 1;
    transition: width 350ms, opacity 250ms;
}

.breadcrumb a::after {
    content: '';
    display: block;
    width: 0;
    opacity: 0;
    height: 2px;
    background: #007bff;;
    margin-left: 0;
    border: none;
}

#breadcrumb-page-selector {
    border: 1px solid lightgrey;
    background: #DDD;
    border-radius: 5px;
    padding: 1px;
}

.breadcrumb .breadcrumb-item {
    padding-top: 6px;
}

.breadcrumb li .switch label {
    margin-bottom: 0;
}

/*
| ---------------------------------------
| Erreurs
| ---------------------------------------
*/
.error-pulse {
    color: #610000;
    border-radius: 5px;
    transform: scale(1);
    animation: pulse-red 2s infinite;
}

@keyframes pulse-red {
    0% {
        transform: scale(0.97);
        box-shadow: 0 0 0 0 rgba(255, 82, 82, 0.9);
    }

    70% {
        transform: scale(1);
        box-shadow: 0 0 0 10px rgba(255, 82, 82, 0);
    }

    100% {
        transform: scale(0.97);
        box-shadow: 0 0 0 0 rgba(255, 82, 82, 0);
    }
}

/*
| ---------------------------------------
| quick moving
| ---------------------------------------
*/
.quick_moving_founded {
    z-index: 1000 !important;
}

.quick_moving_founded a.fc-timegrid-event {
    animation: pulse-red .75s infinite;
}

html[data-theme="dark"] .quick_moving_founded a.fc-timegrid-event {
    animation: pulse-yellow .75s infinite;
}

@keyframes pulse-red {
    0% {
        box-shadow: 0 0 0 5px rgba(217, 30, 24, 1);
    }
    90% {
        box-shadow: 0 0 0 15px rgba(217, 30, 24, 0);
    }
    100% {
        box-shadow: 0 0 0 5px rgba(217, 30, 24, 0);
    }
}

@keyframes pulse-yellow {
    0% {
        box-shadow: 0 0 0 5px rgba(255, 255, 0, 1);
    }
    90% {
        box-shadow: 0 0 0 15px rgba(255, 255, 0, 0);
    }
    100% {
        box-shadow: 0 0 0 5px rgba(255, 255, 0, 0);
    }
}

/*
| ---------------------------------------
| Loader
| ---------------------------------------
*/
.cm-spinner {
    height: 200px;
    width: 200px;
    border: 4px solid transparent;
    border-radius: 50%;
    border-top: 4px solid #f15e41;
    -webkit-animation: spin 4s linear infinite;
    animation: spin 4s linear infinite;
    position: absolute;
    z-index: 10000;
    left: calc(100% / 2 - 100px);
    top: 40%;
}

.cm-spinner::before,
.cm-spinner::after {
    content: "";
    position: absolute;
    top: 6px;
    bottom: 6px;
    left: 6px;
    right: 6px;
    border-radius: 50%;
    border: 4px solid transparent;
}

.cm-spinner::before {
    border-top-color: #bad375;
    -webkit-animation: 1s spin linear infinite;
    animation: 1s spin linear infinite;
}

.cm-spinner::after {
    border-top-color: #26a9e0;
    -webkit-animation: spin .5s linear infinite;
    animation: spin .5s linear infinite;
}

@-webkit-keyframes spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

@keyframes spin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

#indexing-loader {
    display: none;
    position: absolute;
    z-index: 10000;
    top: 15px;
    left: 50%;
    width: 100px;
    height: 100px;
    border-radius: 50%;
    color: #fff;
    margin: -10px;
    padding-left: 0;
    padding-top: 25px;
    background: #000000;
    background-size: 400% 400%;
}

@-webkit-keyframes indexingpulse {
    0% {
        background-position: 0 48%
    }
    50% {
        background-position: 100% 53%
    }
    100% {
        background-position: 0 48%
    }
}

@-moz-keyframes indexingpulse {
    0% {
        background-position: 0 48%
    }
    50% {
        background-position: 100% 53%
    }
    100% {
        background-position: 0 48%
    }
}

@keyframes indexingpulse {
    0% {
        background-position: 0 48%
    }
    50% {
        background-position: 100% 53%
    }
    100% {
        background-position: 0 48%
    }
}

.lds-grid {
    display: inline-block;
    position: relative;
    width: 20px;
    height: 20px;
    left: 0;
    margin-bottom: 12px;
    margin-left: -18px;
}

.lds-grid div {
    position: absolute;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: #03b9ff;
    animation: lds-grid 1.2s linear infinite;
}

.lds-grid div:nth-child(1) {
    top: 4px;
    left: 4px;
    animation-delay: 0s;
}

.lds-grid div:nth-child(2) {
    top: 4px;
    left: 16px;
    animation-delay: -0.4s;
}

.lds-grid div:nth-child(3) {
    top: 4px;
    left: 28px;
    animation-delay: -0.8s;
}

.lds-grid div:nth-child(4) {
    top: 16px;
    left: 4px;
    animation-delay: -0.4s;
}

.lds-grid div:nth-child(5) {
    top: 16px;
    left: 28px;
    animation-delay: -0.2s;
}

.lds-grid div:nth-child(6) {
    top: 16px;
    left: 16px;
    animation-delay: -1.2s;
}

.lds-grid div:nth-child(7) {
    top: 28px;
    left: 4px;
    animation-delay: -0.8s;
}

.lds-grid div:nth-child(8) {
    top: 28px;
    left: 16px;
    animation-delay: -1.2s;
}

.lds-grid div:nth-child(9) {
    top: 28px;
    left: 28px;
    animation-delay: -1.6s;
}

@keyframes lds-grid {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0;
    }
}

/*
| ---------------------------------------
| Toast
| ---------------------------------------
*/
.toastjs-container {
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    z-index: 10001 !important;
    transition-duration: .5s
}

.toastjs {
    text-align: center;
}

.toastjs.danger {
    background-color: #f34a40;
    color: #FFFFFF;
}

.toastjs.success {
    background-color: #13b338 !important;
    color: #ffffff;
}

/*
| ---------------------------------------
| Notify JS
| ---------------------------------------
*/
.notifyjs-bootstrap-base {
    background-size: 32px !important;
    padding-left: 40px !important;
    padding-top: 8px !important;
    font-weight: 300 !important;
    border: none !important;
    font-size: 20px !important;
    text-shadow: none !important;
}

.notifyjs-bootstrap-error {
    border-color: #B94A48 !important;
    background-color: #ff8080 !important;
    color: #ae3331 !important;
}

.notifyjs-bootstrap-success {
    border-color: #468847 !important;
    background-color: #74d974 !important;
    color: #009302 !important;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAABmJLR0QA/wD/AP+gvaeTAAAEtElEQVRoge2Zz29UVRTHP+e9KQuCC1tAptNK+KGdCq4YOm1XQtxI+NWFwYgmLlxIgMR/wIWJcW+kVWJ0VRIpJi0NumxMIS0zGdxI6ZRYIqXTEkpnoVgE581xMQXaeXfmvdd51gX97Obec+79nnvPve/NebDGGs83EsYgfdpnb81tbcNin6J7QOJAFNiwaPIAmAGdEOSaWjqUfCmZFpFirXPXFEA6l25WS0+q8h4QC+g+DdpLke72pvbplWpYUQDDs79sWqeFz0A/ANatdPJFHit8V4f9SaIxcT+oc+AAUjOpdxW+BOqD+nowj+qp9lj790GcfAeQ0UydM+v0KHwYXFsgzkai9umEJP7xY+wrgMxMZn2Bwg8gb9WmzTc/RbDfTjQmFrwMLS+DjGbqVlk8wIEChYtjY2Oe58szAGfW6Vll8YvIm3+8+OALT6tqnaMz6eOC9oYnKjiq8k5HrO18pf6KAaSmUw1qkQU2/ifK/JOPYLdUumIrppBa8jmrKH7u4VylrvqCFj6t1GncgavTV5uwZJLaH1K+uDGfZWDyIu1bkux/+Q2TyeMI9iuJxsRUeYdxB8SWU6yS+PF8SXxRi4zMjjI09bPJbF2BwglThysAVbVUOR62UBPj8+P0/1YS/4Srd1PcWzClk7zfp312easrgHQunQSaQlVqYDyfpX9ycJl4EeHw9oNsXr/J5BJrurttT3mjO4Us9oUp1MR4PutaeRHhyPZD7N64q6Kfpbrf1VbeUIREWEJNVBJ/ePvBquJLqPcOCLxau0wz1cS/vnG3jxGkpbzFdAtF/QoyHzYzpgMrIhzdcdineAB1aTMFsMHQ5mI4d5lvrn/Lr/eve9pWO7C7Gl7zM13JB14ob4v49l7CcO4yw9NXABi8dQmg4iouveefCgmUNtUx7cCDag73Fua4kht5+ltVGbx1ibH5Gy7bG/OlnHeKtaTNMxT+LG8zBTBbbZDN6zfRtfMIljxzVVUGJgeXpVM2P8HFW+aVD5I2yxGXNlcKKdwUqHqftdbHYScMTD5b3Sc7AVBn1dE/OeBa+drTRic8A7Ago9DlNVRrfRxUlx3OJ0EI4n5I7TjE7gave95DvpIx6C0zsnTI74CtDa107TyCbS1PJ+NDqkbxALYlLm2u12lVtVKz6d+BZr8DZ/MTrpSBcG8bhan2aNu28mqe+0ksUgQ9F2TweH0LXTuOLtuJMMUDCHLOVIo0/yMr0g08DjLB0iDCF8+jolPortBnZnQm9ZXAR0EnG89ncYqOjxcz/6hwpiOaPG3qqxjAyJ2Resu2J/j//9TPR7Djgf/UdzZ35lE1Rr2aiHCiWtG3amFrsdB6NnRVflHpTkaTF6qZeFbmpqK3TwIDoYnyz48PG//62MsoQHHXuQAcqFmWD1S5VCf2sVCKuwCJxsRCJGofVfi6dnkeqHT/3bjQ5Uc8rOADx2gufUxEzxDy7SQwh3DSK+fL8bUDS+mItZ2XInFUewQeBfUvR+CRCmccx4kHFb/ov3JG7ozELNs6BXKcAO9Oi9wB6S06he7O5s7cSjWE8plVVa3Ru5lEqW6je0rVA42x9DOrMI1yU5WMbcnQ3i17r4XxmXWNNZ53/gWeFuU7tUC6hwAAAABJRU5ErkJggg==") !important;
}

.notifyjs-bootstrap-info {
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAABmJLR0QA/wD/AP+gvaeTAAAD6UlEQVRoge2ZT2wTRxTGv7e7NuB4g4DSFhwUCIFEqgqH0PYM4gIneqhSFVBaCckYJ4h7VSmRUO+lsVNfKiEFiYQeqNRyzIUeUBRLSFxK1BoLTEIc4kNsjOxk93EgQsn+ye7srldI5HfzmzfzvqcZ78y8AbbY4sOGAhllkuXOSvVLScdJBvVJQC8D+wDE1zxqDMwBeEzgPIOniuX2aQyT7je0rwQOZ+oHmPQ0wBcYSAhGLrFO44omZf67Git51eApge4b1b2agusAvgcQ9Rp8jSYBvysy/zSbbH8p2lk4ga5s7TsG/wpgt2hfB5aYMFhMqbdFOrlOoC/HkYpWywK4JCxNAGLkdinxoXySVlz5u3Han+PYdq36B4PO+JPnDma+11TUb+aSVHfylZwc+nIcCVM8ABDR2W1a7c/PJtnx/+WYQEWrZcMUv47Tr1/WfnFy2nQJdY3VzjPzeHCaxGHGt8W0OmHXbptAYnR5T1SifwF81BJl7qlEZO6x+8TaLqGoRD/Dh/gfjkXwYKANDwbaMPB5xOswALB7RacRu0bLGei+Ue/QFO1/eNykvtgnY+Lcjne/GUD/3deYmde8DAcATZKVI4XkjqfGBssZ0BV9ED522OMfbxyWLGyCRPVVLWXVYB51mCUmPu8n2sPyxjMaA3i44O/cJhFfxCTLJrvR0Plp9SswOvwEm5nXMPJPAwuvGAuvGCP3G8i/8Lx8AAAMJA4tLfcZ7YrRIOk46SvSGjcfreDmI1enAdcQ6BSA6fU20wwQ04lAowYIg0wzYEpAJxwNR44neowG0xKitzcp3xRS8Q2/u8Zq/gdlszarb1vcwva+oBoNvj7O7wNWCQQw1y2jajSYEmBgPhwtHiCzNlMCEmM2HDWeeGw0mGeAeCYcLeIwm7VZLCGeCkeOOBLLJm2mBIrl9mkAz0JRJMbTwmIsbzRanEZJZ6ZboUgSgEG3rEqRlvuAokkZAM2Wq3JPY5WkjFWD7Z24K1sdY+By6zQJwBh9klaHrJpsd+JmVP8RgHCtsgUsRRS2vRPbJlC6tLPCBMusQya1WdF307NQMaXeJkYueE2uyTy5ot7ZzMHxMFfYG08TcDc4TW6hvzvL8WuOXm6G2p/jWHS1eoeIzvoX5gb6qyG39QdS3AWAuSTV9yjqOQJ+8y/OkUxnue1rN+IBDw8cBzPVfiKMIviS4yKAtNOaNyJ8oSmm1Ymmzr0gZAE0RPtb0ABjdCWq94qKB3w+8nWM1ROKrg/S20LYAcHuzxg0vkpSppSKPfeqIZhn1mGWDn2yfIJAp9ZKHz1gJLDumRVACYRZZp6RWJ4qLMbyQTyzbrHFh84bhqRC3BxZlk0AAAAASUVORK5CYII=") !important;
}

.notifyjs-bootstrap-warn {
    border-color: #B94A48 !important;
    background-color: #ffe1ab !important;
    color: #965f00 !important;
    background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAYAAABXAvmHAAAABmJLR0QA/wD/AP+gvaeTAAAChUlEQVRoge2YT2sTQRjGf9Nmd6NFIlHx4EUQPbR48AOIVtFDUD9Bj6LFPwj2JngRBMFiBC9+Bc+CJ8GmQu9SAoIEL7UgDShEoWnavF7aZLvN7szszlbB/Z2WzOy8z5tn5mESKCgoKCj4n1F5LSwLwRUUrwHoq9tqev19HnVyaUCWqNIrfwGpbn/0k75/Wk132q5rjbleEIBe8DQkHuAw4xtP8ijl3AFZ9CcR9QkoRYa2QM6pCxvLLuu5d0BUnb3iAcZBvXRdzmkD0ghuAFcTplySheC6y5rOtpA08WkHy8AZTcUWv7pTqkbXRV13DrSD++jEAwinOBjcdVXWiQMjYlOHs1h148De2NThLFYzOxAXmw/mp/jR8QA4UulRf9iMvuokVrM7EBObXqk/ePa9fnQYHMVqpgaSYtP3ZPAcbiZC5lhN3YA08YHncePhbz3czAgFdXlHkFZHegc0semVhqL9eAcyx2qqBmSJKqhHSXN2O5DQAIDisXw4dDSNlnQOGMRmWLSnayBDrFo3IIv+JHBTNy+8bfxSwhkYLMwtafhnbfXYOxB/29yF8RkYkipWrRowuG0OsDoDQ6xj1bgBXWxGsTwDYUVWsWrugOltc5uwaM/kDOxgGatGd6EUt82sGN9WzRywv21mxThWtQ4k/EhP5Ntambcfj6OAa+e/c+LYus3rYHhb1YsyjM0or96cZHWtDMDX1QM8u/fZdomdWL2cNClxC9nEZpTOb2/ksyXaWI1twDY2o8zUVqhMbFKZ2GSmtpJ2GW2sxp4BaQRzwHz6yg4R5tTF7otRQ0lb6E5OcuwZi9eSz3+j+0h8A8IsitY+ahmNosWWmv3bMgoKCgoK/k3+AILkzValVvu5AAAAAElFTkSuQmCC") !important;
}

/*
| ---------------------------------------
| Ligne de titre
| ---------------------------------------
*/
.company-logo {
    width: 81px;
}

.academic-information-container {
    padding: 5px;
    color: #757575 !important;
    font-size: 11px;
}

/*
| ---------------------------------------
| Container du calendrier
| ---------------------------------------
*/
.flex-parent {
    display: flex;
    flex-direction: column;
    width: 100%;
    height: 100%;
    justify-content: flex-start;
    align-items: stretch;
    align-content: stretch;
}

.flex-calendar {
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: stretch;
    align-content: stretch;
    overflow: auto;
    height: 100%;
}

#calendar {
    max-width: 100%;
}

.calendar-weeks-infos {
    background-color: #fff !important;
    color: #b2b7bb !important;
    font-weight: 300;
    font-size: .8em;
    text-align: center;
}

/*
| ---------------------------------------
| Calendrier
| ---------------------------------------
*/
#calendar {
    font-size: 9pt !important;
}

.fc .fc-timegrid-slot-minor {
    border-top-style: dashed;
}

.fc-event {
    cursor: pointer !important;
}

.fc-event-main {
    overflow: hidden !important;
    transition: box-shadow .25s;
}

.fc-event-main:hover {
    box-shadow: 0 0 0 2px #313131 inset;
    z-index: 500;
}

.fc-toolbar * {
    font-size: 10pt !important;
}

.fc-toolbar-title {
    font-size: 12pt !important;
}

.fc .fc-toolbar.fc-footer-toolbar {
    background-color: #ececec;
    padding: 10px;
    border-radius: 5px;
    margin-top: 0;
    font-size: 10pt;
}

.fc-resourceTimeGridDayWeek-view .fc-resource .fc-scrollgrid-sync-inner,
.fc-resourceTimelineDay-view .fc-scrollgrid-section-header .fc-timeline-header-row:nth-child(2) .fc-day {
    background-color: #206bc1;
    color: #FFFFFF;
}

.fc-export-button,
.fc-import-button {
    color: #fff;
    background-color: #62686e !important;
    border-color: #4b5258 !important;
}

.fc-reload-button,
.fc-messages-button,
.fc-mediachanges-button,
.fc-config-button {
    color: #fff;
    background-color: #343a40 !important;
    border-color: #343a40 !important;
}

.fc-publish-button {
    color: #fff;
    background-color: #28a745 !important;
    border-color: #28a745 !important;
}

.table-bordered,
.table-bordered td,
.table-bordered th {
    border-color: #f1f1f1 !important
}

.fc .fc-timegrid-slot-lane {
    border-color: #f1f1f1 !important
}

/*
| ---------------------------------------
| Events
| ---------------------------------------
*/
.remote-course {
    background-image: url('../img/icons/work-home.png') !important;
    background-repeat: no-repeat !important;
    background-size: contain !important;
}

.fc .fc-list-event td {
    transition: background-color 300ms;
}

.fc .fc-list-event:hover td {
    background-color: #f5f5f5ba;
}

.fc-timegrid-event.remote-course {
    background-position: center;
}

.fc-timegrid-event-harness-inset .fc-timegrid-event,
.fc-timegrid-event.fc-event-mirror,
.fc-timegrid-more-link {
    box-shadow: none;
}

/*
| ---------------------------------------
| Highlight de selection
| ---------------------------------------
*/
.fc .fc-timegrid-col-bg .fc-highlight,
.fc .fc-timegrid-col-events {
    z-index: unset;
}

.fc .fc-highlight {
    background: #1a4f87d9 !important;
    color: #ffffff !important;
}

/*
| ---------------------------------------
| Toolbar
| ---------------------------------------
*/
@media (max-width: 1200px) {
    .fc .fc-toolbar.fc-footer-toolbar {
        display: block;
        text-align: center;
    }

    .fc .fc-toolbar.fc-footer-toolbar .fc-toolbar-chunk:nth-child(1) .input-group {
        padding-left: 15px;
        padding-right: 15px;
    }

    .fc .fc-toolbar.fc-footer-toolbar .fc-toolbar-chunk:nth-child(3) .btn {
        margin-top: 5px;
    }

    .fc-header-toolbar .fc-toolbar-chunk {
        display: block;
    }
}

/*
| ---------------------------------------
| Modale d'information
| ---------------------------------------
*/
#informationModal .modal-dialog {
    max-width: 95% !important;
    font-size: 10pt !important;
}

#informationModal #informationModalLabel {
    font-weight: 500;
    font-size: 12pt;
    color: #2c91f7;
}

#informationModal .courseTitle {
    font-size: 18pt;
    font-weight: 300;
}

#informationModal .main-label {
    border-bottom: 2px solid #d1e8ff;
    color: #696969;
    width: 100%;
    padding: 5px 5px 5px 0;
    font-size: 13pt;
    font-weight: 100;
}

#informationModal .modal-body span {
    /*font-weight:600;*/
}

#informationModal .modal-body span.specpad {
    font-size: 11pt;
    font-weight: 500;
}

#informationModal .modal-body h6 {
    /*color:#007bff;*/
}

#informationModal #informationModal_infos_subcontainer {
    padding: 10px;
}

#informationModal_infos_container {
    display: none;
}

/*
| ---------------------------------------
| Modale de modifications
| ---------------------------------------
*/
#updateEventModal .modal-dialog {
    max-width: 95% !important;
}

#updateEventModal .modal-body * {
    font-size: 9pt;
}

#updateModalLoader,
#updateModalError {
    padding: 50px 0;
    margin-left: 20px;
    display: none;
}

#updateEventModal .tab-pane {
    padding-top: 20px;
}

#updateEventModal .main-label,
#updateEventModal #updateEventModal_ID_info {
    border-bottom: 2px solid #d1e8ff;
    color: #696969;
    width: 100%;
    padding: 5px 5px 5px 0;
    font-size: 11pt;
    font-weight: 100;
}

#updateEventModal #updateEventModal_ID_info {
    border-bottom: none !important;
}

#updateEventModal .jumbotron {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
}

#updateEventModal .autocomplete {
    position: relative !important;
    width: 100% !important;
}

#updateEventModal .modale-messages-content-info-action {
    background-color: #e7f3ff;
}

#updateEventModal input,
#updateEventModal select {
    background-color: #f5faff;
    border-color: #c6e5ff;
}

/*
| ---------------------------------------
| Modale de configuration
| ---------------------------------------
*/
#configurationModalLoader {
    margin-left: 20px;
    display: none;
}

#configurationModal #configuration-grades-datatable td {
    padding: .50rem;
}

#configurationModal .main-label {
    padding: 5px;
    width: 100%;
}

/*
| ---------------------------------------
| Onglets des Modales
| ---------------------------------------
*/
#configurationModal .modal-body .tab-content .tab-pane .container,
#updateEventModal .modal-body .tab-content .tab-pane .container {
    padding-top: 15px;
}

#configurationModal .nav-tabs,
#updateEventModal .nav-tabs {
    background-color: #f0f7ff;
}

#configurationModal .nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover,
#updateEventModal .nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {
    background-color: #d4e7fd;
}

#configurationModal .nav-tabs .nav-link.active:focus, .nav-tabs .nav-link.active:hover,
#updateEventModal .nav-tabs .nav-link.active:focus, .nav-tabs .nav-link.active:hover {
    background-color: #fff;
}

/*
| ---------------------------------------
| Surcharge font-awesome
| ---------------------------------------
*/
.fa-spin {
    animation-duration: 1s;
}

/*
| ---------------------------------------
| Export
| ---------------------------------------
*/
#export-loader,
#export-finish,
#import-loader {
    display: none;
    background: #fff;
    border-radius: 10px;
    margin: 5px;
    padding: 5px;
}

#export-loader img,
#export-finish img,
#import-loader img {
    width: 150px;
}

/* Deprec */
#import-report {
    display: none;
}
/* Deprec */
#import-report .list-group {
    margin-top: 10px;
}
/* Deprec */
#import-report .list-group li {
    font-size: 12px !important;
    padding: .50rem 1.25rem;
}
/* Deprec */
#import-report .list-group li span {
    font-weight: bold;
}

/*
| ---------------------------------------
| Import
| ---------------------------------------
*/
#fileDropper {
    height:200px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-width: 1px;
    border-style: solid;
    border-color: #c5c9cd;
    transition: background-color,border,color  500ms;
}
#fileDropper p {
    text-align: center;
}
#fileDropper.dragging {
    background-color: #b9fcc7 !important;
    color:#28a745;
    border-style: dashed !important;
    border-width: 3px !important;
    border-color: #28a745 !important;
}

html[data-theme="dark"] #fileDropper {
    background-color: #2e2e2e !important;
    border-color: #646464;
}

/*
| ---------------------------------------
| Message Manager
| ---------------------------------------
*/
#messages-reload, #messages-archives {
    text-decoration: none;
    padding: 10px;
}

#messages-reload:hover::after,
#messages-archives:hover::after {
    width: 100%;
    opacity: 1;
    transition: width .7s, opacity .5s;
    background: #C0C0C0;
}

#messages-reload::after,
#messages-archives::after {
    content: '';
    display: block;
    width: 0;
    opacity: 0;
    height: 2px;
    background: #007bff;
    margin-left: 0;
    border: none;
    margin-top: 5px;
    transition: background .5s;
}

#messages-manager-sorter,
#messages-manager-input-searcher {
    width: auto;
    margin: 5px;
}

.message-type-button-indicator-true::after {
    width: 100% !important;
    opacity: 1 !important;
}

.message-type-button-indicator-false::after {
    width: 0;
    opacity: 0;
}

.messagesManager-container {
    font-size: 9pt;
}

#messages-table tr > td {
    border-top: 2px solid #babbbb
}

#messages-manager-searcher-results-info {
    padding: 5px;
}

/*
| ---------------------------------------
| >> CONFIGURATION <<
| ---------------------------------------
*/
.configuration-main-container {
    font-size: 9pt;
}

.configuration-main-container .btn,
.configuration-main-container .form-control {
    font-size: 9pt;
}

[contenteditable="true"].single-line {
    white-space: nowrap;
    width:200px;
    overflow: hidden;
    padding: 5px;
}

[contenteditable="true"].single-line br {
    display:none;
}

[contenteditable="true"].single-line * {
    display:inline;
    white-space:nowrap;
}

#rooms-list-container .list-group .list-group-item,
#grades-list-container .list-group .list-group-item,
#mediaserver-list .list-group .list-group-item,
#teachers-list .list-group .list-group-item {
    padding:5px;
}

#configuration-teachers-list .table tr td {
    padding-top: 10px;
    padding-bottom: 5px;
}

#rooms-list .btn-danger:disabled {
    color: #fff;
    background-color: #818181;
    border-color: #747474;
}

/* LIST JS SORT */
.sort {
    padding: 5px;
    cursor: pointer;
}

.sort.asc,
.sort.desc {
    background-color: #dce0e1;
    color: #212529;
    border-radius: 5px;
}

.sort.asc::after {
    font-family: "Font Awesome 6 Pro", serif;
    content: "\f15d";
    font-weight: 300;
    font-size:16px;
    margin-left: 10px;
    padding-left: 3px;
}

.sort.desc::after {
    font-family: "Font Awesome 6 Pro", serif;
    content: "\f15e";
    font-weight: 300;
    padding-left: 3px;
    font-size:16px;
    margin-left: 10px;
}

/*
| ---------------------------------------
| Service de données
| ---------------------------------------
*/
#snapshots-accordion .card {
    border:none !important;
}
#snapshots-accordion .card .card-header {
    padding: 0;
}
#snapshots-accordion .btn-link {
    color: #3a3a3a;
}


/*
| ---------------------------------------
| MediaServer Changes
| ---------------------------------------
*/
.mediaserver-notification-table {
    font-size:10pt;
    width:100%;
    border-collapse: collapse;
}

.mediaserver-notification-table td {
    padding:10px;
    border:none;
}

.mediaserver-notification-table .media-title-row {
    font-size:9pt;
    text-align:center;
    background-color:#d7d7d7;
    color:#383838;
}

.mediaserver-notification-table .media-title-row td{
    padding:3px 10px;
}

.mediaserver-notification-table .compartment-title td {
    padding:10px !important;
    color:#ffffff;
}

.mediaserver-notification-table .compartment-title.to_add {
    background-color:#28a745;
}

.mediaserver-notification-table .compartment-title.to_update {
    background-color:#ffc107;
}

.mediaserver-notification-table .compartment-title.to_remove {
    background-color:#dc3545;
}

.mediaserver-notification-table .compartment-title.unknown {
    background-color:#cfcfcf;
}

.mediaserver-notification-table .compartment-title.unknown td{
    background-color:#cfcfcf;
    color:#565656 !important;
}

.mediaserver-notification-table .itemdata td {
    border:1px solid #e5e5e5;
}

.mediaserver-notification-table td.different {
    color:red;
    font-weight:bold;
}

.mediaserver-notification-table .novalue-data {
    background-color: #e9e9e9;
    color: #858585;
}

.mediaserver-notification-table .separator {
    border-left: 1px solid #b5b5b5;
}

/*
==================
DARK MODE
=================
*/
/**
| ---------------------------------------
| Switch
| ---------------------------------------
*/
.switch {
    display: inline-block;
    position: relative;
}

.switch__input {
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    width: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
}

.switch__label {
    position: relative;
    display: inline-block;
    width: 60px;
    height: 30px;
    background-color: #2b2b2b;
    border: 1px solid #5b5b5b;
    border-radius: 5px;
    cursor: pointer;
    transition: all 0.4s cubic-bezier(0.46, 0.03, 0.52, 0.96);
}

.switch__indicator {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) translateX(-72%);
    display: block;
    width: 20px;
    height: 20px;
    background-color: #7b7b7b;
    border-radius: 9999px;
    box-shadow: 10px 0 0 0 rgba(0, 0, 0, 0.2) inset;
}

.switch__indicator::before,
.switch__indicator::after {
    position: absolute;
    content: '';
    display: block;
    background-color: #fff;
    border-radius: 9999px;
}

.switch__indicator::before {
    top: 4px;
    left: 4px;
    width: 5px;
    height: 5px;
    background-color: #919191;
    opacity: 0.6;
}

.switch__indicator::after {
    bottom: 4px;
    right: 3px;
    width: 7px;
    height: 7px;
    background-color: #919191;
    opacity: 0.8;
}

.switch__decoration {
    position: absolute;
    top: 65%;
    left: 50%;
    display: block;
    width: 3px;
    height: 3px;
    background-color: #fff;
    border-radius: 9999px;
    animation: twinkle 2s infinite -0.6s;
}

.switch__decoration::before,
.switch__decoration::after {
    position: absolute;
    display: block;
    content: '';
    width: 3px;
    height: 3px;
    background-color: #fff;
    border-radius: 9999px;
}

.switch__decoration::before {
    top: -10px;
    left: 5px;
    opacity: 1;
    animation: twinkle 2s infinite;
}

.switch__decoration::after {
    top: -3.5px;
    left: 15px;
    animation: twinkle 2s infinite -1s;
}

@keyframes twinkle {
    50% {
        opacity: 0.2;
    }
}

.switch__indicator,
.switch__indicator::before,
.switch__indicator::after {
    transition: all 0.4s cubic-bezier(0.46, 0.03, 0.52, 0.96);
}

.switch__input:checked + .switch__label {
    background-color: #c3d6f5;
    border-color: #a4c3f7;
}

.switch__input:checked + .switch__label .switch__indicator {
    background-color: #ecd21f;
    box-shadow: none;
    transform: translate(-50%, -50%) translateX(72%);
}

.switch__input:checked + .switch__label .switch__indicator::before,
.switch__input:checked + .switch__label .switch__indicator::after {
    display: none;
}

.switch__input:checked + .switch__label .switch__decoration {
    top: 50%;
    transform: translate(0%, -50%);
    animation: cloud 8s linear infinite;
    width: 10px;
    height: 10px;
}

.switch__input:checked + .switch__label .switch__decoration::before {
    width: 5px;
    height: 5px;
    top: auto;
    bottom: 0;
    left: -4px;
    animation: none;
}

.switch__input:checked + .switch__label .switch__decoration::after {
    width: 8px;
    height: 8px;
    top: auto;
    bottom: 0;
    left: 8px;
    animation: none;
}

.switch__input:checked + .switch__label .switch__decoration,
.switch__input:checked + .switch__label .switch__decoration::before,
.switch__input:checked + .switch__label .switch__decoration::after {
    border-radius: 9999px 9999px 0 0;
}

.switch__input:checked + .switch__label .switch__decoration::after {
    border-bottom-right-radius: 9999px;
}

@keyframes cloud {
    0% {
        transform: translate(0%, -50%);
    }
    50% {
        transform: translate(-50%, -50%);
    }
    100% {
        transform: translate(0%, -50%);
    }
}

/*
| ---------------------------------------
| tags
| ---------------------------------------
*/
html[data-theme="dark"] .text-primary,
html[data-theme="dark"] .nav-tabs .nav-link,
html[data-theme="dark"] #messages-reload,
html[data-theme="dark"] #messages-archives {
    color: #4fa4ff !important;
}

/*
| ---------------------------------------
| Loader
| ---------------------------------------
*/
html[data-theme="dark"] #export-loader,
html[data-theme="dark"] #export-finish,
html[data-theme="dark"] #import-loader {
    color: #212529 !important;
}

/*
| ---------------------------------------
| Calendar
| ---------------------------------------
*/
html[data-theme="dark"] body,
html[data-theme="dark"] .calendar-weeks-infos,
html[data-theme="dark"] .academic-information-container {
    background-color: #1d2124 !important;
    color: #ffffff !important;
}

html[data-theme="dark"] .table-bordered,
html[data-theme="dark"] .table-bordered td,
html[data-theme="dark"] .table-bordered th {
    border-color: #323232 !important
}

html[data-theme="dark"] .fc .fc-timegrid-slot-lane {
    border-color: #323232 !important
}

html[data-theme="dark"] .form-control,
html[data-theme="dark"] .custom-select {
    color: #ebebeb !important;
    background-color: #2c2c2c !important;
    border: 1px solid #4b4c4c !important;
}

html[data-theme="dark"] .input-group-text {
    color: #ebebeb !important;
    background-color: #646464 !important;
    border: 1px solid #4b4c4c !important;
}

html[data-theme="dark"] .fc-list-table,
html[data-theme="dark"] .fc-list-table .fc-list-event td,
html[data-theme="dark"] .fc-list-day th {
    border: none !important;
}

html[data-theme="dark"] .fc-list-table .fc-list-event td {
    border-bottom: 1px solid #3e3e3e !important;
}

html[data-theme="dark"] .fc-list-day th {
    color: #ebebeb !important;
    background-color: #4c4c4c !important;
    z-index: 1;
}

/*
| ---------------------------------------
| Events
| ---------------------------------------
*/
html[data-theme="dark"] .fc-event {
    border-color: rgba(0, 0, 0, 1) !important;
    filter: brightness(0.85);
}

html[data-theme="dark"] .fc .fc-list-event:hover td {
    background-color: #2b4574ba;
}

/*
| ---------------------------------------
| Information modale
| ---------------------------------------
*/

html[data-theme="dark"] .modal-header {
    border-bottom: 1px solid #5b5c5c;
}

html[data-theme="dark"] .modal-footer {
    border-top: 1px solid #5b5c5c;
}

html[data-theme="dark"] .modal-content,
html[data-theme="dark"] .card,
html[data-theme="dark"] .breadcrumb,
html[data-theme="dark"] .fc .fc-toolbar.fc-footer-toolbar {
    background-color: #424242 !important;
}

html[data-theme="dark"] #informationModal .main-label,
html[data-theme="dark"] #updateEventModal .main-label,
html[data-theme="dark"] #updateEventModal #updateEventModal_ID_info {
    color: #e9e9e9 !important;
    border-bottom: 2px solid #445464 !important;
}

html[data-theme="dark"] #updateEventModal #updateEventModal_ID_info {
    border-bottom: none !important;
}

html[data-theme="dark"] #updateEventModal-teachers-currents li,
html[data-theme="dark"] #informationModal_teachers li,
html[data-theme="dark"] #profileModal .list-group li {
    background-color: #2e2e2e !important;
}

html[data-theme="dark"] #updateEventModal-teachers-currents li i,
html[data-theme="dark"] #informationModal_teachers li i {
    color: #e9e9e9 !important;
}

html[data-theme="dark"] .nav-tabs {
    border-bottom: 1px solid #495057;
    background-color: transparent !important;
}

html[data-theme="dark"] .nav-tabs .nav-item.show .nav-link,
html[data-theme="dark"] .nav-tabs .nav-link.active {
    color: #ffffff !important;
    background-color: #10335a;
    border-color: #495057 #495057 #10335a;
}

html[data-theme="dark"] .nav-tabs .nav-link.disabled {
    color: #6c757d !important;
}

html[data-theme="dark"] #configurationModal .nav-tabs .nav-link.active:focus,
html[data-theme="dark"] .nav-tabs .nav-link.active:hover,
html[data-theme="dark"] #updateEventModal .nav-tabs .nav-link.active:focus,
html[data-theme="dark"] .nav-tabs .nav-link.active:hover {
    background-color: #10335a;
    color: #ffffff !important;
}

html[data-theme="dark"] .nav-tabs .nav-link:hover,
html[data-theme="dark"] #updateEventModal .nav-tabs .nav-link:hover {
    background-color: #245183;
    color: #ffffff !important;
    border-color: #495057 #495057 transparent;
}

html[data-theme="dark"] #updateEventModal .modale-messages-content-info-action {
    background-color: #343a40 !important;
    color: #ffffff !important;
}

/*
| ---------------------------------------
| breadcrumb
| ---------------------------------------
*/
html[data-theme="dark"] .breadcrumb a {
    color: #4fa4ff !important;
}

html[data-theme="dark"] #breadcrumb-page-selector {
    border: 1px solid #4b4c4c !important;
    background: #424242 !important;
    color: #ffffff !important;
}

/*
| ---------------------------------------
| MessageManager
| ---------------------------------------
*/
html[data-theme="dark"] #messages-table {
    color: #ffffff !important;
}

html[data-theme="dark"] #messages-table .list-group li {
    background-color: #0b4381 !important;
    color: #ffffff !important;
}

/*
| ---------------------------------------
| Configuration
| ---------------------------------------
*/
html[data-theme="dark"] #logs-table {
    color: #fff;
}

/*
| ---------------------------------------
| List Group Dark Configuration
| ---------------------------------------
*/
html[data-theme="dark"] #mediaserver-list .list-group .list-group-item,
html[data-theme="dark"] #configuration-teachers-list .list-group .list-group-item,
html[data-theme="dark"] #rooms-list-container .list-group .list-group-item,
html[data-theme="dark"] #grades-list-container .list-group .list-group-item,
html[data-theme="dark"] #teachers-list-container .list-group .list-group-item {
    background-color: #2c2c2c;
    border-color: #4b4c4c;
}

/*
| ---------------------------------------
| List Group Rooms
| ---------------------------------------
*/
html[data-theme="dark"] #rooms-list-container .list-group .border-left,
html[data-theme="dark"] #grades-list-container .list-group .border-left,
html[data-theme="dark"] #teachers-list-container .list-group .border-left,
html[data-theme="dark"] #configuration-teachers-list .list-group .list-group-item .border-right {
    border-color: #4b4c4c !important;
}

html[data-theme="dark"] #mediaserver-list .list-group .bg-light,
html[data-theme="dark"] #rooms-list-container .list-group .bg-light,
html[data-theme="dark"] #grades-list-container .list-group .bg-light,
html[data-theme="dark"] #teachers-list-container .list-group .bg-light {
    background-color: #9d9d9d29 !important;
}

/*
| ---------------------------------------
| List Snapshots
| ---------------------------------------
*/
html[data-theme="dark"] #snapshots-accordion-container .list-group .list-group-item {
    background-color: #2c2c2c;
    border-color: #4b4c4c;
}

html[data-theme="dark"] #snapshots-accordion .btn-link {
    color: #ffffff;
}

html[data-theme="dark"] #snapshots-accordion .list-group .bg-light {
    background-color: #00000029 !important;
}

/*
| ---------------------------------------
| MediaServer Changes
| ---------------------------------------
*/
html[data-theme="dark"] .mediaserver-notification-table {
    font-size:10pt;
    width:100%;
    border-collapse: collapse;
}

html[data-theme="dark"] .mediaserver-notification-table td {
    padding:10px;
    border:none;
}

html[data-theme="dark"] .mediaserver-notification-table .media-title-row {
    background-color:#2c2c2c;
    color:#b3b3b3;
}

html[data-theme="dark"] .mediaserver-notification-table .media-title-row td{
    padding:3px 10px;
}

html[data-theme="dark"] .mediaserver-notification-table .compartment-title td {
    padding:10px !important;
    color:#ffffff;
}

html[data-theme="dark"] .mediaserver-notification-table .compartment-title.to_add {
    background-color:#1e7231;
}

html[data-theme="dark"] .mediaserver-notification-table .compartment-title.to_update {
    background-color:#b98d0a;
}

html[data-theme="dark"] .mediaserver-notification-table .compartment-title.to_remove {
    background-color:#8b262f;
}

html[data-theme="dark"] .mediaserver-notification-table .compartment-title.unknown {
    background-color:#cfcfcf;
}

html[data-theme="dark"] .mediaserver-notification-table .compartment-title.unknown td{
    background-color:#cfcfcf;
    color:#565656 !important;
}

html[data-theme="dark"] .mediaserver-notification-table .itemdata td {
    border:1px solid #3c3c3c;
    color:#FFFFFF;
}

html[data-theme="dark"] .mediaserver-notification-table td.different {
    color:red;
    font-weight:bold;
}

html[data-theme="dark"] .mediaserver-notification-table .novalue-data {
    background-color: #2a2a2c;
    color: #858585;
}
html[data-theme="dark"] .mediaserver-notification-table .separator {
    border-left: 1px solid #444444;
}

html[data-theme="dark"] .mediaserver-notification-table .allUpdated {
    color: #FFFFFF;
}