@CHARSET "UTF-8";

/* ============================ @IMPORT ============================ */
/* ------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------- */

@import "https://files.inria.fr/dircom/extranet/fonts-inria-sans.css"; 



/* ============================ [VARIABLE] =========================== */
/* ------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------- */

:root {

/* ========================== BODY ========================== */
    --body-background: #e5e5e5;
    --foot-background: #272f3d;
    --banner-background: #e5e5e5;

/* ========================== WIDGET ========================== */
    --widget-background: #f7f7f7;
    --widget-border: 1px solid var(--widget-border-color);
    --widget-border-color: #c8cad0;
    --widget-radius: 12px;
    --widget-radius-top: 12px 12px 0px 0px;
    --widget-margin: 0px 0px 20px;
    --widget-padding: 5px 20px 5px 20px;
    --widget-accordeon-padding: 10px 0px 20px 0px;
    --widget-titre-padding: 15px 0px 0px;
    --box-shadow: 0 3px 4px #00000029;
    --radius: 3px;
    --form-control: #fff;


/* ========================== FONT ========================== */
    --texte-color: #444a52; 
    --texte-color-label:#fff;
    --texte-color-btn:#fff;
    --texte-color-footer:#fff;
    --texte-color-hov-footer:#89ccca;
    --texte-ban-color: #6d2065;
    --texte-action-color: #C9191E;
    --texte-action-hov-color: #D95E61;

/* ========================== FONT SIZE ========================== */
    --font-size-titre: 20px;
    --font-size-label: 22px;
    --font-size-paragraphe: 16px;


/* ========================== ETIQUETTE ========================== */
    --label-bg-color:#C9191E;


/* ========================== MENU ========================== */
    --navigation-background:#272f3d;
    --menu-backdground: #384257; 


/* ========================== FOOTER ========================== */
    --footer-backdground: #272f3d ; 
    --footer-background-gradient: linear-gradient(100deg, #384257 0%, #384257 20%, #131f3b 70.71%);

/* ========================== BOUTON ========================== */
    --bouton-background:#C9191E; 
    --bouton-hov-background: #D95E61; 
    --bouton-hov-2-background: #cdd0d3;
    --bouton-hov-3-background: #D8D9DD;
    --bouton-2-background :#747B8B;
    --bouton-3-background: #8c88a6;
    --bouton-4-backdground: #384257; 


    --side-border-radius: 0px 7px 0px 7px;
    --dropbtn-border-radius : 3px 0px 0px 3px;

/* ========================== ANIMATION ========================== */
    --transition: .3s cubic-bezier(.25,.8,.5,1); 
}


/* ============================ CODE CSS ============================ */
/* ------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------- */



/* =========================== BODY/HTML =========================== */
/* ------------------------------------------------------------------------------------------------------------------- */

/* -- Couleur du fond de la page et texte par defaut -- */
/* ------------------------------------------------------------------------- */

body, html {
    background-color: var(--body-background)!important;
    color: var(--texte-color)!important;
}

/* -- Hauteur Minimum de la Div Main pour toujours avoir le footer en bas de page -- */
/* ----------------------------------------------------------------------------------------------------------------------- */

main {
    min-height: 58.1vh;
}

/* ============================= FONT ============================== */
/* ------------------------------------------------------------------------------------------------------------------- */

/* -- Importation de la font Inria-Sans -- */
/* ----------------------------------------------------- */

body {font-family: 'Inria Sans';}

/* -- Couleur des liens (URL-HTML) -- */

a {color: var(--texte-action-color)}
a:hover {color: var(--texte-action-hov-color);}


/* -- Titre des news du widget news (native) -- */
/* -------------------------------------------------------------- */

.title {font-size: 16px;}

/* -- Taille de la police des widget news native / sherpa / Doc Intergrale -- */
/* ------------------------------------------------------------------------------------------------------ */

.custom-page .widget .widget-header {font-size: 18px;}


/* -- Pas de Font Inra dans la navbar CCSD -- */
/* ------------------------------------------------------------ */

nav.navbar.header {
    font-family: Noto Sans,sans-serif;
}

/* -- Couleur commun des h* -- */
/* ----------------------------------------- */

h1, h2, h3, h4 {
    color: var(--texte-color);
}

/* ========================= TITRE PARAGRAPHE ======================= */
/* ------------------------------------------------------------------------------------------------------------------- */

/* -- Style des Titres -- */
/* --------------------------- */

.titre-page { color: var(--texte-color);}

.titre-widget-flex {
    padding: 10px 0 0 0;
    font-size: var(--font-size-titre);
    font-weight: bold;
}

/* -- Style des paragraphe-- */
/* ----------------------------------- */

.paragraphes {  /* -> Paragraphe pour texte/widget natif */
    color: var(--texte-color);
    font-size: var(--font-size-paragraphe);
    line-height: 30px;
    padding: 10px 10px 10px 10px;
}

.paragraphes-flex { /* -> Paragraphe pour texte/widget flex (créer) */
    color: var(--texte-color);
    font-size: var(--font-size-paragraphe);
    line-height: 30px;
    padding: 15px 0 0 0;
}

/* -- Style du titre label (petite étiquette) -- */
/* --------------------------------------------------------- */

.titre-label, .titre-label-2 {
    background-color: var(--label-bg-color);
    box-shadow: var(--box-shadow);
    border-radius: var(--radius);
    color: var(--texte-color-label);
    font-size: var(--font-size-label);
    padding: 7px 16px 0px 16px;
    text-align: center;
    width: 20%;
}
.titre-label-2 {
    width: 35%;
}

/* ========================== Page Principale ========================= */
/* ------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------- */

/* ============================= Bannière =========================== */
/* ------------------------------------------------------------------------------------------------------------------- */


/* -- Texte Portail HAL Inria -> Style btn -- */
/* ------------------------------------------------------- */

.color-major-color, .color-major-color a {
    padding: 5px 10px 5px;
    background-color: var(--bouton-2-background);
    border-radius: var(--widget-radius);
    transition: var(--transition);
    font-family: Noto Sans,sans-serif;
}
.color-major-color a:hover{
    background-color: var(--bouton-hov-background);
}

span.color-major-color, i.color-major-color {
    background-color: unset;
    color: var(--texte-color) !important;
}


.color-major-color > a:nth-child(1) {
    color: var(--texte-color-btn) !important;
}

/* -- Background de la zone de la barre de recherche -- */
/* --------------------------------------------------------------------------- */

.sub-header {
   background-color: var(--body-background)!important;
   box-shadow: unset;
}
.navbar.navbar-expand-lg.sub-header{
   background-color: var(--banner-background) !important;
   box-shadow: unset!important;
}

/* -- Taille de la div dans la banniere qui comporte les elements de texte et image -- */
/* --------------------------------------------------------------------------------------------------------------------- */

div.section-corps {
    width: 100%;
    margin: 0 0 0 21vw;
}
.section-corps.p-4 {
    margin: 0px 0 0 0vw!important;
}
.section-corps.custom-page.p-4 {
    margin: 0 9.5% !important;
}

/* -- Comportement/Style de la bannière -- */
/* ---------------------------------------------------------- */

.logo {
    display: flex;
    background-image: url('../public/banniere_fond_gauche.png');
    background-repeat: no-repeat;
    height: 150px;
    min-height: unset;
    justify-content: center;
    align-items: center;
    background-size: auto;
    background-position-y: 14px;
    background-color: var(--banner-background);
}

/* -- Pseudo element de la banniere -- */
/* --------------------------------------------------- */

.logo::before {
    content: "";
    height: 150px;
    width: 70px;
    background: url(../public/banniere_br.png) no-repeat;
    display: inline-block;
    background-size: 100%;
    position: absolute;
    left: 0;
}
.logo::after {
    content: "";
    height: 250px;
    width: 618px;
    background: url(../public/logo_grid.png) no-repeat;
    display: inline-block;
    background-size: 100%;
    background-position-y: center;
}

/* -- Texte et cadre de la banniere -- */
/* ----------------------------------------------- */

.text-ban {
    display: flex;
    justify-content: center;
    align-items: center;
    max-width: 39vw;
    height: 130px;
    color: var(--texte-ban-color);
    background-image: linear-gradient(90deg, rgba(2,0,36,0) 0%, currentcolor 50%, rgba(255,255,255,0) 100%);
    background-repeat: no-repeat;
    background-size: 330px 2px;
    background-position: 50%;
    background-color: var(--banner-background);
    font-family: Noto Sans,sans-serif;
    font-weight: bold;
    font-size: 18px;
    line-height: 50px;
    box-shadow: 13px 9px 21px -11px #0000006b;
    border: 3px solid var(--label-bg-color);
    border-radius: 0px 12px 12px 0px;
}

/* -- Pseudo element du texte et cadre la banniere -- */
/* ------------------------------------------------------------------------ */

.text-ban::before {
    content: "";
    height: 130px;
    width: 39vw;
    position: absolute;
    background: linear-gradient(320deg, transparent 0%, var(--banner-background) 50%, var(--banner-background) 100%);
    clip-path: polygon(0% 0%, 0% 100%, 2% 95%, 2% 8%, 99% 8%, 99% 92%, 0 93%, 0 100%, 100% 100%, 100% 0%);
}

/*.text-ban::after {
    content: "Portail INRIA.HAL.SCIENCE VERSION PREPRODUCTION";
    height: 100px;
    width: 578px;
    z-index: 1;
    background-image: linear-gradient(90deg, rgba(2,0,36,0) 0%, currentcolor 50%, rgba(255,255,255,0) 100%);
    background-repeat: no-repeat;
    background-size: 330px 2px;
    background-position: 50%;
}


/* -- Responsive Banniere -- */
/* ------------------------------------ */

@media (max-width: 991px) {
div.section-corps {
    margin: 0 0 0 0vw;
}
.text-ban {
    max-width: unset;
    border-radius: 0px 12px 12px 0px;
    border: 0px;
    border-right: 3px solid var(--label-bg-color);
    height: 135px;
    font-size: 2.4vw;
    background-size: 50% 2px;
    box-shadow: 17px 0px 17px -16px #0000006b;
    background-position-y: 42px;
}
.text-ban::before{
    content: unset;
}
.logo{
    background-image: unset;
}
.logo::before {
    content: unset;
}
}


/* ========================== Zone du menu ========================== */
/* -------------------------------------------------------------------------------------------------------------------- */

/* -- Barre du Menu principal -- */
/* ----------------------------------------- */

.website-navigation {
    background: linear-gradient(0deg, var(--menu-backdground) 0%, var(--menu-backdground) 95%, var(--label-bg-color) 95%);
    min-height: 45px;
    padding-bottom: 0px;
    padding-top: 0px;
    box-shadow: 0 12px 24px 0 rgba(56, 66, 87, 0.31);
}

/* -- Elements du menu principal -> Bouton -- */
/* -------------------------------------------------------------- */

.nav-pills .nav-link { 
    border-radius: 0px;
    padding-top: 5px !important;
}

/* -- Couleur des boutons du menu principal + (au passage de la souris)  -- */
/* ------------------------------------------------------------------------------------------------------- */

.nav-pills .nav-link.active, .nav-pills .show > .nav-link{
    background-color: var(--bouton-background);
    color: var(--texte-color-btn);
}

.website-navigation .nav-pills .nav-link:hover, .website-navigation .nav-pills .show > .nav-link { 
    background: var(--bouton-hov-background);
    color: var(--texte-color-btn);
}

/* ====================== Zone du menu DropDown ===================== */
/* -------------------------------------------------------------------------------------------------------------------- */

/* -- Style du menu déroulant (principal) et position du sous menu -- */
/* ----------------------------------------------------------------------------------------------- */

.website-navigation .nav-pills .dropdown-menu {
    background: var(--menu-backdground)!important;
    border: unset;
    border-radius: unset;
    padding: unset;
    margin: 0px;
}
.website-navigation .dropdown-menu .dropdown-submenu > .dropdown-menu {
    margin-left: -2px;
    margin-top: 0px;
}

/* -- Couleur du texte dans le menu déroulant (principal) +(au passage de la souris) -- */
/* ------------------------------------------------------------------------------------------------------------------------ */

.website-navigation .dropdown-menu a { 
   color: var(--texte-color-btn);
}

.website-navigation .dropdown-menu li.nav-item:hover a { 
   color: var(--texte-color-btn)!important;
}

/* ==================== Menu Administrer dans HAL ===================== */
/* -------------------------------------------------------------------------------------------------------------------- */

/* -- Style du bouton -- */
/* ----------------------------- */

.nav.navbar-nav.ml-auto li .btn-admin[aria-expanded="true"] {
   background-color: var(--widget-background)!important;
   border-radius: var(--widget-radius-top);
}
.nav.navbar-nav.ml-auto li .btn-admin.btn-active, .nav.navbar-nav.ml-auto li .btn-admin:hover {
   background-color: var(--body-background)!important;
   border-radius: var(--widget-radius-top);
}


/* -- Style du menu -- */
/* -------------------------- */

.dropdown-menu {
   background-color: var(--widget-background)!important;
}

/* -- After du menu ( Fleche < ) -- */
/* ------------------------------------------- */

.header .administration-menu .list-group-item-arrowed:first-child::after {
   border-right: 10px solid var(--widget-background)!important;
   left: -18px;
}

.dropdown-menu.show {
   box-shadow: var(--box-shadow);
}

/* -- Fond des elements du menu + (au passage de la souris) -- */
/* -------------------------------------------------------------------------------------- */

.list-group-item {
   background-color: var(--widget-background)!important;
}

.header .administration-menu .list-group-item:hover {
   background-color: var(--bouton-hov-2-background)!important;
   color: var(--texte-color)!important;
}


/* -- Fond de la zone Mes Roles -- */
/* -------------------------------------------- */

.header .administration-menu .roles {
   background-color: var(--widget-background)!important;
}

/* -- Element  de la zone Mes Roles -- */
/* ------------------------------------------------- */

.header .administration-menu .roles span {
   background-color: var(--bouton-3-background)!important;
   border-radius: var(--radius)!important;
   color: var(--texte-color-btn)!important;
   padding: 9px 10px 7px!important;
}

/* ======================= Menu Profil dans HAL ======================== */
/* -------------------------------------------------------------------------------------------------------------------- */

/* -- Icon sans avatar -- */
/* ----------------------------- */

.user-circle {
   background-color: var(--menu-backdground)!important;
   border: 2px solid var(--body-background)!important;
}
.btn.btn-secondary.dropdown-toggle.position-relative:focus {
box-shadow: unset;
}

/* -- Style des items au passage de la souris -- */
/* -------------------------------------------------------------- */

.header .connected-menu .list-group-item:hover, .list-group-item-action:focus, .list-group-item-action:hover {
   background-color: var(--bouton-hov-2-background)!important;
}

#log-out:hover {
   background-color: var(--bouton-hov-background)!important;
   color: var(--texte-color-btn)!important;
}
.header .connected-menu .list-group-item#log-out, .header .connected-menu .list-group-item#log-out:hover[class^="icon-"] {
   color: var(--texte-action-color) !important;
}
.header .connected-menu .list-group-item#log-out:hover, .header .connected-menu .list-group-item#log-out:hover[class^="icon-"] {
   color: var(--texte-color-btn) !important;
}


/* ======================== Widgets Natif à HAL ======================== */
/* ------------------------------------------------------------------------------------------------------------------- */


/* -- Entête des widgets Natifs -- */
/* ------------------------------------------- */

.section-corps .widget .widget-header { 
   background-color: transparent;
   padding: var(--widget-titre-padding);
   color: var(--texte-color);
}

/* -- Widgets natifs -- */
/* -------------------------- */

 .section-corps .widget {
   margin: var(--widget-margin);
   border: var(--widget-border);
   box-shadow: var(--box-shadow);
   border-radius: var(--widget-radius);
   background-color: var(--widget-background);
}

/* ========================== ( Widget Actualités ) ========================== */
/* -------------------------------------------------------------------------------------------------------------------------- */

.card {
    background-color: var(--widget-background);
    border: 1px solid var(--widget-border-color);
}

.card-header {
    background-color: var(--widget-background);
    border-bottom: var(--widget-border);
}
.card-body {
    background-color: var(--widget-background);
    color: var(--texte-color);
    border-top: 1px solid var(--widget-border-color);
}

/* -- Couleur du texte -- */
/* ------------------------------ */

.title {
color: var(--texte-color);
}

/* ========================= ( Widget Txt Intégral ) ========================= */
/* -------------------------------------------------------------------------------------------------------------------------- */

.label.label-default.label-contrast { 
    background-color: var(--label-bg-color)!important;
    color: var(--texte-color-label);
    border-radius: var(--radius);
    font-size: var(--font-size-label);
    padding: 8px 20px 0px;
    clip-path: polygon(0 0,calc(100% - 10px) 0,100% 10px,100% 100%,10px 100%,0 calc(100% - 10px));

}

/* ========================= ( Widget dernière publication ) ========================= */
/* --------------------------------------------------------------------------------------------------------------------------------------- */

.list-deposit .media { 
    margin-top: 0px;
    transition: var(--transition);
    border-left: 2px solid transparent;
    border-bottom: 0px solid;
    padding: 10px;
    font-size: 14px;
}

/* -- (au passage de la souris) -- */
/* ------------------------------------------ */

.list-deposit .media:hover {
    border-color: var(--label-bg-color);
    background-color: var(--bouton-hov-3-background);
    transform: translatey(-5px);
}


/* -- Couleur du texte -- */
/* ------------------------------ */

.list-deposit .media .media-body a {
    color: var(--texte-color);
    font-weight: bold;
}

.list-deposit .media .media-body a:hover {
    color: var(--texte-action-color);
}

/* -- Marge interne des éléments -- */
/* ----------------------------------------------- */

.list-deposit { 
    padding: 10px 10px;
}
/* -- Marge externe du texte -- */

.media-body { 
    margin-left: 10px;
}

/* ========================= ( Widget Mots-clés  ) ========================= */
/* ------------------------------------------------------------------------------------------------------------------------ */

.widget-cloud .keyword {
    display: inline-flex;
    background-color: var(--bouton-background);
    color: var(--texte-color-label);
    font-size: var(--font-size-paragraphe);
    border-radius: var(--side-border-radius);
    padding: 4px 12px;
    margin-top: 5px;
    padding-bottom: 0px;
    transition: var(--transition);
}

/*  -- Marge interne -- */
/* ---------------------------- */

.widget-cloud { 
    padding: 20px;
}

/*  -- (au passage du curseur) -- */
/* ----------------------------------------- */

.widget-cloud .keyword:hover { 
    background-color: var(--bouton-hov-background);
}


/* ========================= ( Widget Actus ) ========================= */
/* ----------------------------------------------------------------------------------------------------------------- */

.widget-feeds .link span, .widget-feeds .link .btn-link span[class^="icon-"] {
    color: var(--texte-action-color);
}
.widget-feeds .link a:hover, .widget-feeds .link a:hover path, .widget-feeds .link a:hover span, .widget-feeds .link a:hover span[class^="icon-"] {
color: var(--texte-action-hov-color);
}

/* ================== Widgets Non Natifs (Widget Créer)================== */
/* ------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------- */

/* =================== ( Bouton custom des Widgets ) ==================== */
/* ------------------------------------------------------------------------------------------------------------------- */

/* -- Bouton du widget -- */
/* -------------------------------- */

.widget-liens-btn {
    display: flex;
    border-radius: var(--radius);
    font-size: var(--font-size-paragraphe);
    padding: 6px 12px 2px;
    transition: var(--transition);
}

/* -- Au passage de la souris -- */
/* ---------------------------------------- */

.widget-liens-btn:hover {
    background-color: var(--bouton-background);
    color: var(--texte-color-label);
}


/* ======================== ( Widget Carousel ) ======================== */
/* ------------------------------------------------------------------------------------------------------------------- */

/* -- Widgets Carousel  -- */
/* -------------------------------- */

.widget-carousel-item {
    position: relative;
    float: left;
    width: 100%;
    margin-right: -100%;
    backface-visibility: hidden;
    transition: transform var(--transition);
    margin-bottom: 50px;
    min-height: 233px;
}

/* -- Widgets Carousel Zone Indicateur -- */
/* ------------------------------------------------------- */

.carousel-indicators {
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 15;
    display: flex;
    justify-content: center;
    margin: 15px 0;
    list-style: none;
    padding: 0;
}

/* -- Widgets Carousel Indicateur - Point [•••] -- */
/* ---------------------------------------------------------------- */

.carousel-indicators li {
    background-color: var(--bouton-background);
    background-clip: padding-box;
    cursor: pointer;
    margin: 0px 6px;
    width: 10px;
    height: 10px;
    border-top: 0;
    border-bottom: 0;
    border-radius: 3px;
    transform: rotate(45deg);
    transition: var(--transition);
}
.carousel-indicators li:hover {
    transform: scale(1.5);
}

.carousel-indicators .active {
    opacity: 1;
}

.carousel-inner {
    margin-bottom: 40px;
}

/* ========================= ( Carousel Slider ) ========================= */
/* ------------------------------------------------------------------------------------------------------------------- */

/* -- Widget Carousel -> Slider -- */
/* ------------------------------------------ */

#widget-slider {
    margin: var(--widget-margin);
    border: var(--widget-border);
    box-shadow: var(--box-shadow);
    border-radius: var(--widget-radius);
    background-color: var(--widget-background);
}

.slider-object {
    position: relative;
    display: none;
    float: left;
    width: 100%;
    margin-right: -100%;
    backface-visibility: hidden;
    transition: transform 0.6s ease-in-out;
}

.slider-object.active, .slider-object-next, .slider-object-prev {
    display: block;
}

.slider-control-prev, .slider-control-next {
    position: absolute;
    top: 75px;
    bottom: 10px;
    z-index: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3%;
    background: none;
    border: 0;
    transition: var(--transition);
}
.slider-control-next {
    border-radius: 15px 0px 0px 15px;
}
.slider-control-prev {
    border-radius: 0px 15px 15px 0px;
}

.slider-control-prev:hover, .slider-control-next:hover {
    background: var(--bouton-hov-background);
    opacity: 50%;
}

.slider-control-prev { left: 0;}

.slider-control-next { right: 0;}

.slider-control-prev::before {
    content: "◄";
    color: var(--texte-color);
    font-size: 1.2rem;
    font-weight: bold;
}

.slider-control-next::before {
    content: "►";
    color: var(--texte-color);
    font-size: 1.2rem;
    font-weight: bold;
}
.slider-control-prev:hover::before, .slider-control-next:hover::before {
    color: var(--texte-color-btn);
}

/* ========================= ( Widget News ) ========================= */
/* ----------------------------------------------------------------------------------------------------------------- */

.widget-news-titre {
    display: table;
    background-color: var(--label-bg-color);
    font-size: var(--font-size-label);
    color: var(--texte-color-label);
    padding: 7px 16px 0px 16px;
    margin: 0px 0px 0px 0px;
    text-align: center;
    width: 100%;
    border-radius: var(--widget-radius-top);
}

.widget-news-contenu {
    padding: 5px 55px;
}

/* ========================= ( Widget Lien Utiles  ) ========================= */
/* ------------------------------------------------------------------------------------------------------------------------- */

.widget-liens-utiles {
    display: block;
    margin: var(--widget-margin);
    /*border: var(--widget-border);*/
    box-shadow: var(--box-shadow);
    border-radius: var(--widget-radius);
   /*background-color: var(--widget-background);*/
    border: 2px solid transparent;
    background: linear-gradient(var(--widget-background) 0 0) padding-box, linear-gradient(to left, var(--bouton-background), var(--widget-background)) border-box;
}


/* -- Style dans le widget -- */
/* ---------------------------------- */

.widget-liens-utiles-contenu {
    display: block;
    margin: var(--widget-margin);
    padding: 10px 25px 0px 25px;
}

/* -- Titre du widget -- */
/* ---------------------------- */

.widget-liens-utiles-titre {
    padding: var(--widget-titre-padding);    
    margin: 0px 0px 0px 0px;
    font-size: 20px;
    text-align: center;
    color: var(--texte-color);
}


/* ========= Personnalisation des Pages Non Natives avec Widget Perso  ========== */
/* -------------------------------------------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------------------------------------------- */

/* ========================== Widget Collection ======================== */ 
/* -------------------------------------------------------------------------------------------------------------------- */


/* -- Cartouche Titre Collection -- */
/* ------------------------------------------- */

.widget-collection-titre {
    background-color: var(--label-bg-color);
    color: var(--texte-color-label);
    font-size: 18px;
    margin-top: 20px;
    text-align: center;
    box-shadow: var(--box-shadow);
    border-radius: var(--widget-radius);
    padding: 5px 0px 2px 0px;
}


/* -- Style des widgets Collection -- */
/* ---------------------------------------------- */

.widget-collection {
    display: flex;
    background: var(--widget-background);
    box-shadow: var(--box-shadow);
    border-radius: var(--widget-radius);   
}

/* -- Comportement des items dans le widget -- */
/* ----------------------------------------------------------------- */

.widget-collection-contenu {
    padding: 10px;
    width: 100%;
}


/* ======================= ( Contenaire Flexible ) ======================== */
/* -------------------------------------------------------------------------------------------------------------------- */

/* -- Contenaire Flexible -- */
/* --------------------------------- */

.container-flex, .container-flex-meta {
    display: flex;
    flex-wrap: wrap;
    gap: 10px
}

.container-accordeon-flex {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}


/* ========================== Widget Flexible ======================== */ 
/* ----------------------------------------------------------------------------------------------------------------- */

.widget-flex {
    margin: var(--widget-margin);
    border: var(--widget-border);
    box-shadow: var(--box-shadow);
    border-radius: var(--widget-radius);
    background-color: var(--widget-background);
    box-sizing: border-box;
    padding: var(--widget-padding);
    flex: 1;
}


/* ======================== Accordeon Flexible ======================== */ 
/* ----------------------------------------------------------------------------------------------------------------- */


/* -- Forme l'accordeon-flex -- */
/* --------------------------------------- */

.accordeon-flex {
    flex: 250px;
    margin-left: -40px;
}

/* -- Contenu l'accordeon-flex -- */

.accordeon-flex-content {
    padding: var(--widget-padding);
    display: flex;
    flex-wrap: wrap;
}

@media only screen and (max-width: 1220px) {
.accordeon-flex-content {
    flex-direction: column;
}
}

.accordeon-flex-content::before {
    content: "";
    width:100%;
    height: 1px;
    background: linear-gradient(90deg, rgba(2,0,36,0) 0%, var(--bouton-2-background) 50%, rgba(255,255,255,0) 100%);
    display: block;
    margin-bottom: 10px;

}


/* -- Style de l'accordeon flex -- */
/* ---------------------------------------- */

.accordeon-flex li {
    background-color: var(--widget-background);
    border-radius: var(--radius);
    padding: var(--widget-accordeon-padding);
    box-shadow: var(--box-shadow);
    border: var(--widget-border);
    list-style: none;
    border-radius: var(--widget-radius);
}

/* -- Style l'accordeon flex fermer -- */
/* ----------------------------------------------- */

.accordeon-flex .content-accordeon {
    padding: 0 10px;
    line-height: 26px;
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.3s, padding 0.3s;
}

/* -- Style de la zone clickable de l'accordeon flex -- */

.accordeon-flex li label {
    display: flex;
    align-items: center;
    cursor: pointer;
}

/* ===================== Accordeon Flex Checkbox ===================== */ 
/* ----------------------------------------------------------------------------------------------------------------- */


/* -- Checkbox du menu Accordeon flex -- */
/* -------------------------------------------------------- */

.accordeon-flex [type="checkbox"]:checked + label::before, .accordeon-flex [type="checkbox"]:not(:checked) + label::before, 
.accordeon-flex [type="checkbox"]:checked + label::after, .accordeon-flex [type="checkbox"]:not(:checked) + label::after {
    background-color: var(--bouton-3-background);
    color: var(--texte-color-btn);
    border-radius: var(--radius);
    margin-right: 10px;
    height: 25px;
    width: 25px;
    font-size: 24px;
    font-weight: 700;
    position: unset;
    border: unset;
    transition: var(--transition);
}
.accordeon-flex [type="checkbox"]:checked + label:hover::before, .accordeon-flex [type="checkbox"]:not(:checked) + label:hover::before, .accordeon-flex [type="checkbox"]:checked + label:hover::after, .accordeon-flex [type="checkbox"]:not(:checked) + label:hover::after  {
    background-color: var(--bouton-hov-background);
}

/* -- Checkbox [+] -- */
/* ------------------------ */

.accordeon-flex [type="checkbox"]:checked + label::before, .accordeon-flex [type="checkbox"]:not(:checked) + label::before {
    content: "+";
    padding: 1px 0px 0px 0px;
    margin-right: 10px;
    box-shadow: unset;
    text-align: center;
}

/* -- Checkbox [-] -- */
/* ----------------------- */

.accordeon-flex [type="checkbox"]:checked + label::after, .accordeon-flex [type="checkbox"]:not(:checked) + label::after {
    content: "-";
    padding: 2px 0px 0px 8px;
    left: 30px;
    top: unset;
    line-height: unset;
    position: absolute;


}

/* -- Style l'accordeon ouvert pour la fonction checked -- */
/* ----------------------------------------------------------------------------- */

.accordeon-flex input[type="checkbox"]:checked + label + .content-accordeon {
    max-height: 2000px;
    padding: 10px 10px 20px;
}

/* ==================== Contenu de l'Accordeon Flex ==================== */ 
/* ----------------------------------------------------------------------------------------------------------------- */


/* -- Style des elements dans l'accordeon -- */
/* ---------------------------------------------------------- */

.block-couleur-titre, .block-hex {
    background-color: var(--body-background);
    border: var(--widget-border);
    box-shadow: var(--box-shadow);
    margin: 5px auto 5px auto;
    border-radius: var(--radius);
    transition: var(--transition);
}

@media only screen and (max-width: 1220px) {
.block-couleur-titre, .block-hex {
    width: 100%;
}
}

/* -- Specifique pour l'element de Gauche -- */
/* ----------------------------------------------------------- */

.block-couleur-titre {
    flex: 0 0 25%;
    color: var(--texte-color-btn);
}

/* --  Specifique pour l'element de Droite + (au passage de la souris -- */
/* ------------------------------------------------------------------------------------------------ */

.block-hex {
    color: var(--texte-color);
    flex: 0 0 70%;
}
.block-hex:hover {
    background-color: var(--bouton-hov-2-background);
}

/* -- Cartouche qui indique la couleur dans l'accordeon -- */
/* ------------------------------------------------------------------------------- */

.paragraphes-couleur {
    padding: 6px 10px 0px;
    margin: 0px;
    font-size: var(--font-size-paragraphe);
    font-weight: bold;
    text-align:center;
}

/* -- Bandeau Titre des couleurs -- */
/* --------------------------------------------- */

.bandeau-titre-couleur {
    padding: 7px 16px 0px 16px;
    color: var(--texte-color-label);
    width: 20%;
    text-align: center;
    margin-left: 1vw;
    min-width: 250px;
}

.titre-rouge, .titre-orange, .titre-lilas, .titre-bleu, .titre-vert, .titre-jaune, .titre-mauve, .titre-bleu-clair, .titre-vert-clair, .titre-couleur {
    padding-top: 5px;
    border-radius: var(--side-border-radius);
    box-shadow: var(--box-shadow);}
.titre-rouge {background-color: #e63312;}
.titre-orange {background-color: #ef7d25;}
.titre-lilas {background-color: #9c1053;}
.titre-bleu {background-color: #1587c9;}
.titre-vert {background-color: #95c11f;}
.titre-jaune {background-color: #ffcd1c; color:#000;}
.titre-mauve {background-color: #6561a8;}
.titre-bleu-clair {background-color: #88ccc8; color:#000;}
.titre-vert-clair {background-color: #c6d54f; color:#000;}
.titre-couleur {background-color: #384157;}


/* ================ Box de Couleur a gauche ================= */
/* ------------------------------------------------------------------------------------------------ */

/* -- Rouge ---------------------------------------------------------------------------- */

.rouge {background: #e63312;}
.rouge-hov {background: #b9251a;}
.rouge-deg {background: linear-gradient(90deg, rgb(230, 51, 18) 0%, rgb(123, 27, 10) 100%);}
.rouge-orange {background: linear-gradient(90deg, rgba(230,51,18,1) 0%, rgba(239,125,37,1) 100%);}
.rouge-lilas {background: linear-gradient(90deg, rgba(230,51,18,1) 0%, rgba(156,16,83,1) 100%);}
.rouge-bleu {background: linear-gradient(90deg, rgba(230,51,18,1) 0%, rgba(21,135,201,1) 100%);}
.rouge-vert {background: linear-gradient(90deg, rgba(230,51,18,1) 0%, rgba(149,193,31,1) 100%);}
.rouge-jaune {background: linear-gradient(90deg, rgba(230,51,18,1) 0%, rgba(255,205,28,1) 100%);}
.rouge-mauve {background: linear-gradient(90deg, rgba(230,51,18,1) 0%, rgba(101,97,168,1) 100%);}
.rouge-bleu-clair {background: linear-gradient(90deg, rgba(230,51,18,1) 0%, rgba(136,204,200,1) 100%);}
.rouge-vert-clair {background: linear-gradient(90deg, rgba(230,51,18,1) 0%, rgba(198,213,79,1) 100%);}

/* -- Orange ---------------------------------------------------------------------------- */

.orange {background: #ef7d25;}
.orange-hov {background: #ca6a1f;}
.orange-deg {background: linear-gradient(90deg, rgb(239, 125, 37) 0%, rgb(142, 74, 22) 100%);}
.orange-rouge {background: linear-gradient(90deg, rgba(239,125,37,1) 0%, rgba(230,51,18,1) 100%);}
.orange-lilas {background: linear-gradient(90deg, rgba(239,125,37,1) 0%, rgba(156,16,83,1) 100%);}
.orange-bleu {background: linear-gradient(90deg, rgba(239,125,37,1) 0%, rgba(21,135,201,1) 100%);}
.orange-vert {background: linear-gradient(90deg, rgba(239,125,37,1) 0%, rgba(149,193,31,1) 100%);}
.orange-jaune {background: linear-gradient(90deg, rgba(239,125,37,1) 0%, rgba(255,205,28,1) 100%);}
.orange-mauve {background: linear-gradient(90deg, rgba(239,125,37,1) 0%, rgba(101,97,168,1) 100%);}
.orange-bleu-clair {background: linear-gradient(90deg, rgba(239,125,37,1) 0%, rgba(136,204,200,1) 100%);}
.orange-vert-clair {background: linear-gradient(90deg, rgba(239,125,37,1) 0%, rgba(198,213,79,1) 100%);}

/* -- Lilas ---------------------------------------------------------------------------- */

.lilas {background: #9c1053;}
.lilas-hov {background: #6f0b3b;}
.lilas-deg {background: linear-gradient(90deg, rgb(156, 16, 83) 0%, rgb(91, 9, 49) 100%);}
.lilas-rouge {background: linear-gradient(90deg, rgba(156,16,83,1) 0%, rgba(230,51,18,1) 100%);}
.lilas-orange {background: linear-gradient(90deg, rgba(156,16,83,1) 0%, rgba(239,125,37,1) 100%);}
.lilas-bleu {background: linear-gradient(90deg, rgba(156,16,83,1) 0%, rgba(21,135,201,1) 100%);}
.lilas-vert {background: linear-gradient(90deg, rgba(156,16,83,1) 0%, rgba(149,193,31,1) 100%);}
.lilas-jaune {background: linear-gradient(90deg, rgba(156,16,83,1) 0%, rgba(255,205,28,1) 100%);}
.lilas-mauve {background: linear-gradient(90deg, rgba(156,16,83,1) 0%, rgba(101,97,168,1) 100%);}
.lilas-bleu-clair {background: linear-gradient(90deg, rgba(156,16,83,1) 0%, rgba(136,204,200,1) 100%);}
.lilas-vert-clair {background: linear-gradient(90deg, rgba(156,16,83,1) 0%, rgba(198,213,79,1) 100%);}

/* -- Bleu ---------------------------------------------------------------------------- */

.bleu {background: #1587c9;}
.bleu-hov {background: #0f6597;}
.bleu-deg {background: linear-gradient(90deg, rgb(21, 135, 201) 0%, rgb(13, 81, 121) 100%);}
.bleu-rouge {background: linear-gradient(90deg, rgba(21,135,201,1) 0%, rgba(230,51,18,1) 100%);}
.bleu-orange {background: linear-gradient(90deg, rgba(21,135,201,1) 0%, rgba(239,125,37,1) 100%);}
.bleu-lilas {background: linear-gradient(90deg, rgba(21,135,201,1) 0%, rgba(156,16,83,1) 100%);}
.bleu-vert {background: linear-gradient(90deg, rgba(21,135,201,1) 0%, rgba(149,193,31,1) 100%);}
.bleu-jaune {background: linear-gradient(90deg, rgba(21,135,201,1) 0%, rgba(255,205,28,1) 100%);}
.bleu-mauve {background: linear-gradient(90deg, rgba(21,135,201,1) 0%, rgba(101,97,168,1) 100%);}
.bleu-bleu-clair {background: linear-gradient(90deg, rgba(21,135,201,1) 0%, rgba(136,204,200,1) 100%);}
.bleu-vert-clair {background: linear-gradient(90deg, rgba(21,135,201,1) 0%, rgba(198,213,79,1) 100%);}

/* -- Vert ---------------------------------------------------------------------------- */

.vert {background: #95c11f;}
.vert-hov {background: #6c8c16;}
.vert-deg {background: linear-gradient(90deg, rgb(149, 193, 31) 0%, rgb(97, 125, 20) 100%);}
.vert-rouge {background: linear-gradient(90deg, rgba(149,193,31,1) 0%, rgba(230,51,18,1) 100%);}
.vert-orange {background: linear-gradient(90deg, rgba(149,193,31,1) 0%, rgba(239,125,37,1) 100%);}
.vert-lilas {background: linear-gradient(90deg, rgba(149,193,31,1) 0%, rgba(156,16,83,1) 100%);}
.vert-bleu {background: linear-gradient(90deg, rgba(149,193,31,1) 0%, rgba(21,135,201,1) 100%);}
.vert-jaune {background: linear-gradient(90deg, rgba(149,193,31,1) 0%, rgba(255,205,28,1) 100%);}
.vert-mauve {background: linear-gradient(90deg, rgba(149,193,31,1) 0%, rgba(101,97,168,1) 100%);}
.vert-bleu-clair {background: linear-gradient(90deg, rgba(149,193,31,1) 0%, rgba(136,204,200,1) 100%);}
.vert-vert-clair {background: linear-gradient(90deg, rgba(149,193,31,1) 0%, rgba(198,213,79,1) 100%);}

/* -- Jaune ---------------------------------------------------------------------------- */

.jaune {background: #ffcd1c; color:#000;}
.jaune-hov {background: #caa216; color:#000;}
.jaune-deg {background: linear-gradient(90deg, rgb(255, 205, 28) 0%, rgb(142, 114, 16) 100%); color:#000;}
.jaune-rouge {background: linear-gradient(90deg, rgba(255,205,28,1) 0%, rgba(230,51,18,1) 100%); color:#000;}
.jaune-orange {background: linear-gradient(90deg, rgba(255,205,28,1) 0%, rgba(239,125,37,1) 100%); color:#000;}
.jaune-lilas {background: linear-gradient(90deg, rgba(255,205,28,1) 0%, rgba(156,16,83,1) 100%); color:#000;}
.jaune-bleu {background: linear-gradient(90deg, rgba(255,205,28,1) 0%, rgba(21,135,201,1) 100%); color:#000;}
.jaune-vert {background: linear-gradient(90deg, rgba(255,205,28,1) 0%, rgba(149,193,31,1) 100%); color:#000;}
.jaune-mauve {background: linear-gradient(90deg, rgba(255,205,28,1) 0%, rgba(101,97,168,1) 100%); color:#000;}
.jaune-bleu-clair {background: linear-gradient(90deg, rgba(255,205,28,1) 0%, rgba(136,204,200,1) 100%); color:#000;}
.jaune-vert-clair {background: linear-gradient(90deg, rgba(255,205,28,1) 0%, rgba(198,213,79,1) 100%); color:#000;}

/* -- Mauve ---------------------------------------------------------------------------- */

.mauve {background: #6561a8;}
.mauve-hov {background: #454373;}
.mauve-deg {background: linear-gradient(90deg, rgb(101, 97, 168) 0%, rgb(58, 55, 96) 100%);}
.mauve-rouge {background: linear-gradient(90deg, rgba(101,97,168,1) 0%, rgba(230,51,18,1) 100%);}
.mauve-orange {background: linear-gradient(90deg, rgba(101,97,168,1) 0%, rgba(239,125,37,1) 100%);}
.mauve-lilas {background: linear-gradient(90deg, rgba(101,97,168,1) 0%, rgba(156,16,83,1) 100%);}
.mauve-bleu {background: linear-gradient(90deg, rgba(101,97,168,1) 0%, rgba(21,135,201,1) 100%);}
.mauve-vert {background: linear-gradient(90deg, rgba(101,97,168,1) 0%, rgba(149,193,31,1) 100%);}
.mauve-jaune {background: linear-gradient(90deg, rgba(101,97,168,1) 0%, rgba(255,205,28,1) 100%);}
.mauve-bleu-clair {background: linear-gradient(90deg, rgba(101,97,168,1) 0%, rgba(136,204,200,1) 100%);}
.mauve-vert-clair {background: linear-gradient(90deg, rgba(101,97,168,1) 0%, rgba(198,213,79,1) 100%);}

/* -- Bleu-Clair ---------------------------------------------------------------------------- */

.bleu-clair {background: #88ccc8; color:#000;}
.bleu-clair-hov {background: #6da4a0; color:#000;}
.bleu-clair-deg {background: linear-gradient(90deg, rgb(136, 204, 200) 0%, rgb(71, 106, 104) 100%); color:#000;}
.bleu-clair-rouge {background: linear-gradient(90deg, rgba(136,204,200,1) 0%, rgba(230,51,18,1) 100%); color:#000;}
.bleu-clair-orange {background: linear-gradient(90deg, rgba(136,204,200,1) 0%, rgba(239,125,37,1) 100%); color:#000;}
.bleu-clair-lilas {background: linear-gradient(90deg, rgba(136,204,200,1) 0%, rgba(156,16,83,1) 100%); color:#000;}
.bleu-clair-bleu {background: linear-gradient(90deg, rgba(136,204,200,1) 0%, rgba(21,135,201,1) 100%); color:#000;}
.bleu-clair-vert {background: linear-gradient(90deg, rgba(136,204,200,1) 0%, rgba(149,193,31,1) 100%); color:#000;}
.bleu-clair-jaune {background: linear-gradient(90deg, rgba(136,204,200,1) 0%, rgba(255,205,28,1) 100%); color:#000;}
.bleu-clair-mauve {background: linear-gradient(90deg, rgba(136,204,200,1) 0%, rgba(101,97,168,1) 100%); color:#000;}
.bleu-clair-vert-clair {background: linear-gradient(90deg, rgba(136,204,200,1) 0%, rgba(198,213,79,1) 100%); color:#000;}

/* -- Vert-Clair ---------------------------------------------------------------------------- */

.vert-clair {background: #c6d54f; color:#000;}
.vert-clair-hov {background: #a2ae41; color:#000;}
.vert-clair-deg {background: linear-gradient(90deg, rgb(198, 213, 79) 0%, rgb(136, 147, 55) 100%); color:#000;}
.vert-clair-rouge {background: linear-gradient(90deg, rgba(198,213,79,1) 0%, rgba(230,51,18,1) 100%); color:#000;}
.vert-clair-orange {background: linear-gradient(90deg, rgba(198,213,79,1) 0%, rgba(239,125,37,1) 100%); color:#000;}
.vert-clair-lilas {background: linear-gradient(90deg, rgba(198,213,79,1) 0%, rgba(156,16,83,1) 100%); color:#000;}
.vert-clair-bleu {background: linear-gradient(90deg, rgba(198,213,79,1) 0%, rgba(21,135,201,1) 100%); color:#000;}
.vert-clair-vert {background: linear-gradient(90deg, rgba(198,213,79,1) 0%, rgba(149,193,31,1) 100%); color:#000;}
.vert-clair-jaune {background: linear-gradient(90deg, rgba(198,213,79,1) 0%, rgba(255,205,28,1) 100%); color:#000;}
.vert-clair-mauve {background: linear-gradient(90deg, rgba(198,213,79,1) 0%, rgba(101,97,168,1) 100%); color:#000;}
.vert-clair-bleu-clair {background: linear-gradient(90deg, rgba(198,213,79,1) 0%, rgba(136,204,200,1) 100%); color:#000;}


/* ========================= ( Bandeau Info ) ========================= */
/* ----------------------------------------------------------------------------------------------------------------- */

/* -- Bandeau info importantes -- */
/* -------------------------------------------- */



.label-band-info, .label-band-date {
    background-color: var(--label-bg-color);
    color: var(--texte-color-label);
    border-radius: var(--widget-radius);
    box-shadow: var(--box-shadow);
    font-size: var(--font-size-label);
    padding: 7px 16px 0px 16px;
    margin: 0px 0px 20px 0px;
    text-align: center;
} 

.label-band-info {
    background-color: var(--label-bg-color);
    flex: 1;
} 

.label-band-date {
    background-color: var(--menu-backdground);
    flex: 0;
}



/* ===========================  PAGE Tuto CVHAL ========================== */
/*  ------------------------------------------------------------------------------------------------------------------------- */
/*  ------------------------------------------------------------------------------------------------------------------------- */

/* -- Style et forme des zone d'exemple : couleur banniere -- */
/* ----------------------------------------------------------------------------------- */

.ligne-ex, .ligne-ex-gb, .ligne-ex-m, .ligne-ex-r, .ligne-ex-b, .ligne-ex-rh, .ligne-ex-bh, .ligne-ex-fff, .ligne-ex-000 {
    padding: 20px 0px 15px 35px;
    font-size: 19px;
    border-radius: 15px;
    box-shadow: 0 3px 4px #00000029;
}


/* -- Couleur du fond et texte des zone d'exemple : couleur banniere  -- */
/* --------------------------------------------------------------------------------------------------- */

.ligne-ex {background: #2f3533; color: #ff9d34;}
.ligne-ex-gb, .ligne-ex-m, .ligne-ex-r, .ligne-ex-b, .ligne-ex-rh, .ligne-ex-bh, .ligne-ex-fff {color: #fff;}
.ligne-ex-gb {background: #272f3d;}
.ligne-ex-m {background: #6561a8;}
.ligne-ex-r {background: #e53212;}
.ligne-ex-rh {background: #b9251a;}
.ligne-ex-b {background: #1587c9;}
.ligne-ex-bh {background: #0f6597;}
.ligne-ex-fff {background: #000;} 
.ligne-ex-000 {background: #fff;color: #000;}


/* -- Style du block des boutons de telechargement -- */
/* ------------------------------------------------------------------------- */

.zone-telechargement {
    display: inline-flex;
    flex-direction: column;
    padding: 10px 10px 30px;
}

/* -- Icone des boutons de telechargement -- */
/* ------------------------------------------------------------- */

.icon-telechargement {
    display: inline-block;
    width: 1.067rem;
    height: 1.333rem;
    background: no-repeat url("../public/picto_telechargement.svg") transparent top left / 100% 100%;
}

/* -- Style du texte des boutons de telechargement -- */
/* ------------------------------------------------------------------------- */

.telechargement a {
    color: var(--texte-color);
    margin-left: 15px;
    font-weight: 700;
    font-family: Noto Sans,sans-serif;
}

/* -- Style des boutons de telechargement -- */
/* ------------------------------------------------------------ */

.telechargement {
    background: var(--widget-background);
    border-radius: var(--side-border-radius);
    border: var(--widget-border);
    padding: 14px 20px;
    margin: 1em auto;
    min-width: 350px;
    transition: var(--transition);
}
.telechargement:hover {
    background: var(--bouton-hov-2-background);
    border-color: var(--bouton-2-background);
}

/* =================== Personnalisation des Pages Natifs ==================== */
/* ------------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------------- */

/* ========================== Page Consultation ========================== */
/* ------------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------------- */

/* ============================ Par Structure ============================ */
/* ------------------------------------------------------------------------------------------------------------------------- */

/* -- Style de la recherche par alphabet + (au passage de la souris) -- */
/* ---------------------------------------------------------------------------------------------- */

.pagination li a {
    color: var(--texte-action-color);
    transition: var(--transition);
}

.browse-alphabet li a:hover {
    background: var(--bouton-hov-background);
    color: var(--texte-color-btn);
}

.browse-alphabet li.active a {
    background: var(--bouton-2-background);
    color: var(--texte-color-btn);
}

/* -- Style des element de la page + (au passage de la souris) -- */
/* -------------------------------------------------------------------------------------- */

.list-group-item {
    background-color: var(--widget-background);
    transition: var(--transition);
}
.browse-list li:hover {
    background: var(--bouton-hov-3-background);
}

/* -- Couleur du texte des elements de la page -- */
/* ------------------------------------------------------------------ */

.browse-list li a {
    color: var(--texte-action-color);
}


/* ================== ( Integration Video Page Tuto Video ) ================== */
/* ----------------------------------------------------------------------------------------------------------------------- */

/* -- Redimensionnement de l'intégration vidéo et ajout du responsive -- */ 

.embedresize {
   margin-bottom:15px;
}

.embedresize div {
   position: relative;
   height: 0;
   padding-bottom: 56.25%;
}

.embedresize iframe {
   position: absolute;
   top: 0;
   left: 0;
   width: 100%;
   height: 100%;
   color: transparent;
}


/* ====================== Commun sur plusieur pages ====================== */
/* ------------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------------- */

/* ============== Qol (Quality of Life/Qualité de Vie) / Correctif ================= */
/* ------------------------------------------------------------------------------------------------------------------------- */

/* -- Zone du la preview du PDF la grande -- */
/* ----------------------------------------------------------- */

tr.files > td:nth-child(2) > div:nth-child(1) > iframe:nth-child(1) {
    height: 900px !important;
}

/* -- Meilleur Vue du code CSS  -- */
/* ------------------------------------------- */

#css { 
    min-height: 900px;
    min-width: 100%;
}

/* -- Ergonomie de la zone CSS  -- */
/* ------------------------------------------- */

#header-bg {
    box-shadow: var(--box-shadow);
    background-color: var(--widget-background);
    border-radius: var(--widget-radius);
}

/* -- Bouton Enregistrer CSS + effet au curseur -- */
/* ------------------------------------------------------------------ */

#Enregistrer {
    background-color: var(--bouton-2-background);
    border: 0px;
    border-radius: var(--radius);
    padding: 4px 10px 6px 10px;
    transition: var(--transition);
}

#Enregistrer:hover {
    background-color: var(--bouton-hov-background);
}

#Enregistrer:focus {
    box-shadow: unset;
}

/* -- Correction d'un effet survol inutile dans le menu administrer dans HAL de la barre du CSSD -- */
/* ------------------------------------------------------------------------------------------------------------------------------------------ */

.btn-icon:hover {
    background-color: unset !important;
}

/* -- Disposition des label pour éviter de les coupés sur 2 lignes  -- */
/* -------------------------------------------------------------------------------------------- */

.label.label-primary, .label.label-success, .label.label-warning, .label.label-danger, .label.label-info, .label.label-arxiv, .label.label-default {
    display: inline-block;
}

/* --  Bandeau de message -- */
/* ------------------------------------- */

blockquote {
    border-left: 4px solid var(--label-bg-color)!important;
    background: var(--bouton-hov-3-background) !important;
    border-radius: var(--widget-radius);
}

/* ============================== Bouton ============================== */
/* ----------------------------------------------------------------------------------------------------------------------- */

/*  -- Bouton par defaut -- */
/* --------------------------------- */

.btn.btn-xs {
    background-color: var(--widget-background) !important;
    color: var(--texte-color) !important;
}
#removefilter {
    background-color: var(--bouton-2-background);
    color: var(--texte-color-btn) !important;
    border-radius: var(--radius);
    border: 0px solid !important;
}
.btn-primary.disabled, .btn-primary:disabled {
    border-color: var(--bouton-background) !important;
}
/*  -- Bouton +Déposer + couleurs de l'Inria -- */
/* -------------------------------------------------------------- */

.btn-primary-orange.btn-primary-orange, .btn-primary-red.btn-primary-orange { 
    background: var(--bouton-2-background)!important;
    border: unset!important;
    border-radius: var(--widget-radius);
}
@media (max-width: 991px) {
.btn-primary-orange.btn-primary-orange, .btn-primary-red.btn-primary-orange{
    border-radius: 0px!important;
}
}

#ssheader-submit {
    border-radius: 0px 0px 0px 25px;
}


/*  -- Bouton +Déposer aux couleurs de l'Inria -- */
/* ----------------------------------------------------------------- */

.btn-primary-orange:hover { 
    background-color: var(--bouton-hov-background)!important;
}

/*  -- Bouton Primary et Secondary -- */
/* ------------------------------------------------- */

.btn-primary-blue {
    background-color: var(--bouton-3-background);
    color: var(--texte-color-btn);
}
.btn-primary-blue:hover {
    background-color: var(--bouton-hov-background);
    color: var(--texte-color-btn);
}

.btn-secondary-blue {
    color: var(--bouton-background);
}
.btn-secondary-blue:hover {
    color: var(--texte-action-hov-color);
}

/* -- Pas de BoxShadow en Focus -- */
/* ------------------------------------------------*/

.btn:focus, .btn.focus {
    box-shadow: unset;
}

/*  -- Bouton Pagination -- */
/* --------------------------------- */

.pagination li.active {
    border-bottom: 1px solid var(--texte-action-color)!important;
    color: var(--texte-color-btn);
    background-color: var(--bouton-background);
    padding: 6px 12px 4px 12px;
    border-radius: var(--radius);
}
.pagination li.active a {
    color: var(--texte-color-btn)!important;
}

.pagination li a {
    color: var(--texte-action-color)!important;
}

/*  -- Bouton Voir -- */
/* ------------------------ */

.btn.btn-primary.btn-sm {
    background-color: var(--bouton-2-background) !important;
    border: 0px !important;
    border-radius: var(--radius);
    transition: var(--transition);
}
.btn.btn-primary.btn-sm:hover {
    background-color: var(--bouton-hov-background) !important;
    border-radius: var(--radius);


}

/* ==================== Zone de la Barre de Recherche ===================== */
/* ----------------------------------------------------------------------------------------------------------------------- */


/*  -- Centrage de la barre de recherche  -- */
/* --------------------------------------------------------- */

#ssheader-info {
    width: unset;
}

/*  -- hauteur de la barre de recherche (Ceci affecte le bouton +deposer -- */
/* ------------------------------------------------------------------------------------------------------ */

#ssheader-submit {
    padding: 20px 18px 15px;
}

/*  -- Centrage de la barre de recherche  -- */
/* --------------------------------------------------------- */

#searchHeaderList {
    max-height: 48px;
}

/* ========================= Zone de Recherche ========================== */
/* ----------------------------------------------------------------------------------------------------------------------- */

/*  -- Barre de recherche -- */
/* ---------------------------------- */

.hal-main-search-input {
    background-color: var(--widget-background);
    background-image: linear-gradient(0deg,var(--label-bg-color) 50%,#0000 0)!important;
    color: var(--texte-color);
    border-radius: 15px;
    font-family: revert;
}

/* ======================= Zone Recherches avancées ======================= */
/* ------------------------------------------------------------------------------------------------------------------------- */


/*  -- Centrage de la zone de recherches avancées  -- */
/* ------------------------------------------------------------------------ */

#searchHeaderList #collapseSearch {
    top: 35px!important;
}

#searchHeaderList #advSearchHeader, #searchHeaderList #solrSearchHeader {
    background-color: var(--widget-background);
    padding: 30px 60px 100px;
    box-shadow: var(--box-shadow);
    border-radius: 0px 0px 15px 15px;
}

/* -- Positionnement de la loupe + couleur (harmonisation) -- */
/* ------------------------------------------------------------------------------------ */

.hal-main-search-button { 
    padding: 2px 16px!important;
    color: var(--texte-action-color)!important;
}

/* -- Positionnement de bouton dropdown recherches avancées + couleur (harmonisation) -- */
/* ---------------------------------------------------------------------------------------------------------------------------------- */

.hal-main-advsearch-button {
    color: var(--label-bg-color);
    top: -30px;
}

/* -- Plus grande taille du menu déroulant  -- */
/* ------------------------------------------------------------- */

.dropdown-menu.show {
    max-height: 485px !important;
    padding: 7px 8px;
    border-radius: 5px;
    box-shadow: 0px 5px 8px 0 #00000040;
}

/* ===================== Zone Txt Recherches avancées ===================== */
/* ------------------------------------------------------------------------------------------------------------------------- */

/*  -- Couleur des en-tête Recherche avancee  -- */
/* ----------------------------------------------------------------- */

div.form-group.row label {
    color: var(--texte-color);
}
/*  -- Couleur du titre Recherche avancee  -- */
/* ----------------------------------------------------------- */

#searchHeaderList #advSearchHeader h3, #searchHeaderList #solrSearchHeader h3 {
    color: var(--texte-action-color);
}

/* -- Hauteur des zones textes recherches avancées -- */
/* -------------------------------------------------------------------------- */

div.form-group.row input.input-flex, .input-group > .custom-file, .input-group > .custom-select, .input-group > .form-control, .input-group > .form-control-plaintext { 
    height: 35px;
}

/* ============== Couleur des Btns Recherches avancées/experte =============== */
/* ------------------------------------------------------------------------------------------------------------------------- */


#searchHeaderList #advSearchHeader .mt-3 button, #searchHeaderList #solrSearchHeader .mt-3 button {
    padding: 14px 40px;
    background-color: var(--bouton-2-background);
    border-radius: var(--radius);
    color: var(--texte-color-btn);
    transition: var(--transition);
}

#searchHeaderList #advSearchHeader .mt-3 button:hover, #searchHeaderList #solrSearchHeader .mt-3 button:hover {
    background-color: var(--bouton-hov-background);
    color: var(--texte-color-btn);
}


/* -- Couleur des bouton tel que lancer la recherche  + (au passage de la souris)  -- */
/* ------------------------------------------------------------------------------------------------------------------- */

.hal-visualize-button {
    background-color: var(--bouton-2-background)!important;
    border-radius: var(--radius)!important;
    padding: 14px 40px 7px;
}
.hal-visualize-button:hover {
    background-color: var(--bouton-hov-background)!important;
}


/* -- Hauteur bouton la recherche experte -- */
/* ------------------------------------------------------------ */

#submit-element {
bottom: unset;
}

/* -- Suppression du hover obsolete des boutons ajouter + (au passage de la souris)  -- */
/* ------------------------------------------------------------------------------------------------------------------------- */

div.form-group.row .btn-group-sm > .btn-primary.btn, div.form-group.row .btn-primary.btn-sm {
    margin-left: unset;
}
.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show > .btn-primary.dropdown-toggle {
    background-color: unset;
    border-color: unset;
}

/* -- Correctif des boutons ajouter + (au passage de la souris)  -- */
/* ---------------------------------------------------------------------------------------- */

.input-group span.input-group-btn {
width: unset;
}
.input-group span.input-group-btn button:hover {
    background-color: transparent;
}
.btn.btn-sm.btn-primary.form-btn-multi.form-btn-add:focus {
    box-shadow: unset;
}

/* ================== Couleur Btns DropDown R-avancées ==================== */
/* ------------------------------------------------------------------------------------------------------------------------- */

/* -- Bouton dropdown (couleur et style) -- */
/* --------------------------------------------------------- */

div.form-group.row button.btn-primary, div.form-group.row button.dropdown-toggle {
    color: var(--texte-color-btn);
    font-family: revert;
}

.input-group .form-btn-lang {
    background: var(--bouton-2-background) !important;
    border: none !important;
    border-radius: var(--dropbtn-border-radius);
    transition: var(--transition);
}
.input-group .form-btn-lang:hover {
    background: var(--bouton-hov-background) !important;
}
.btn.btn-sm.btn-default.dropdown-toggle.form-btn-lang{
    background: var(--bouton-2-background) !important;
    border: none !important;
    border-radius: var(--dropbtn-border-radius);
    transition: var(--transition);
}
.btn.btn-sm.btn-default.dropdown-toggle.form-btn-lang:hover{
    background: var(--bouton-hov-background) !important;
}
.btn.btn-sm.btn-default.dropdown-toggle.form-btn-lang:focus {
    box-shadow: none;
}

#document:focus, #author:focus, #structure:focus, #qa:focus,
#document1:focus, #author1:focus, #structure1:focus, #qa1:focus,
#document2:focus, #author2:focus, #structure2:focus, #qa2:focus,
#document3:focus, #author3:focus, #structure3:focus, #qa3:focus,
#document4:focus, #author4:focus, #structure4:focus, #qa4:focus,
#document5:focus, #author5:focus, #structure5:focus, #qa5:focus,
#document6:focus, #author6:focus, #structure6:focus, #qa6:focus,
#document7:focus, #author7:focus, #structure7:focus, #qa7:focus,
#document8:focus, #author8:focus, #structure8:focus, #qa8:focus,
#document9:focus, #author9:focus, #structure9:focus, #qa9:focus,
#document10:focus, #author10:focus, #structure10:focus, #qa10:focus {
    box-shadow: unset;
    border-color: var(--label-bg-color)!important;
}

/* ======================= Bouton sur plusieur pages ======================= */
/* ------------------------------------------------------------------------------------------------------------------------- */

/* -- Bouton [+Ajouter], recherche avancée et page dépot + (au passage de la souris) -- */
/* ------------------------------------------------------------------------------------------------------------------------- */

div.form-group.row span.input-group-btn, .btn.btn-sm.btn-primary.form-btn-multi.form-btn-add {
    background-color: var(--bouton-2-background);
    border-radius: var(--radius);
    color: var(--texte-color-btn)!important;
    transition: var(--transition);
}

div.form-group.row span.input-group-btn:hover, .btn.btn-sm.btn-primary.form-btn-multi.form-btn-add:hover{
    background-color: var(--bouton-hov-background);
}

/* --  Bouton commun sans rendu de base (visible dans la page +depots) (au passage de la souris) --*/
/* -------------------------------------------------------------------------------------------------------------------------------------------- */

.btn {
    transition: unset;
}

/* -- Autres Bouton (Recuperer les metadonnees - Ajouter une relation) + (au passage de la souris) -- */
/* --------------------------------------------------------------------------------------------------------------------------------------------- */

.hal-option-button {
    background-color: var(--bouton-2-background);
    border-radius: var(--radius);
    color: var(--texte-color-btn);
    padding: 14px 20px 9px 20px;
    transition: var(--transition);
}
.hal-option-button:hover {
    background-color: var(--bouton-hov-background);
}

/* -- Bandeau Flash message (barre de gauche) -- */

.flash-message .col-lg-1 {
    background-color: var(--label-bg-color);
    margin: -6px 0;
}

/* -- Bandeau Flash message (background)  -- */

.flash-message {
    background-color: var(--body-background);
    color: var(--texte-color);
    border-radius: 0 12px 12px 0px;
}

/* -- DropDown -- */
/* --------------------- */

/* -- Style des DropDown commun  -- */
ul.dropdown-menu li:not(.not-white):hover {
    background-color: var(--bouton-hov-background) !important;
    border-radius: 4px;
}
ul.dropdown-menu .dropdown-item {
    padding: 4px 15px 0px 15px;
}
.not-white.item-action-share {
    border-radius: var(--radius);
}
.dropdown-tools li.active, .dropdown-tools li:not(.nb-doc-checked):focus, .dropdown-tools li:not(.nb-doc-checked):hover {
    background-color: var(--bouton-hov-background);
}

/* -- Couleur du texte dans le DropDown -- */
/* ---------------------------------------------------------- */

ul.dropdown-menu a {
    color: var(--texte-color);
}

/* ============================ Volet de gauche =========================== */
/* -------------------------------------------------------------------------------------------------------------------------- */

/* -- Background des Menu Acordeon -- */
/* ----------------------------------------------------- */

.title-facet {
    background-color: var(--bouton-2-background);
    color: var(--texte-color-btn);
    border-radius: var(--widget-radius-top);
}
.btn.drop-down.title-facet:hover {
    color: var(--texte-color-btn);
}

/* -- Background des bouton du Menu -- */
/* ------------------------------------------------------ */

.connected-navigation .list-group .list-group-item{
    background-color: var(--widget-background)!important;
    border-left: 5px solid var(--widget-background)!important;
    color: var(--texte-color);
    transition: var(--transition);
}

.connected-navigation .list-group .list-group-item:hover {
    border-left-color: var(--bouton-background)!important;
    background-color: var(--bouton-hov-3-background)!important;
    color: var(--texte-action-color)!important;
}

.connected-navigation .list-group .list-group-item.active, .connected-navigation .list-group .list-group-item.active:hover {
    background-color: var(--bouton-hov-3-background)!important;
    border-left-color: var(--bouton-hov-background)!important;
    color: var(--texte-action-color)!important;
}

/* -- Couleur du texte de l'en-tête (nom du compte) -- */
/* ------------------------------------------------------------------------- */

.strong.pt-3.pb-3 {
    color: var(--texte-color);
}

/* ============================= Page Recap ============================= */
/* ------------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------------- */

/* -- Couleur du texte  -- */
/* ------------------------------ */

.table {
    color: var(--texte-color)!important;
}

/* -- Hauteur des elements externe des widgets de la page par rapport au reste --*/
/* ------------------------------------------------------------------------------------------------------------------ */

.section-corps.row {
    margin-top: 20px;
}

.section-corps.row .header-section {
    margin-bottom: 7px;
}

/* -- Hauteur des elements interne des widgets de la page par rapport au reste --*/
/* ------------------------------------------------------------------------------------------------------------------ */

.abstract div:first-child, .keywords div:first-child {
    margin-top: 5px!important;
}

/* -- Bouton Validation resume apres changement --*/
/* ----------------------------------------------------------------------- */

.btn.btn-primary.btn-sm.editable-submit{
   background: var(--bouton-2-background);
   color: var(--texte-color-btn);
   border: 0px;
   border-radius: var(--radius);
   padding: 4px 6px 3px;
}
.btn.btn-primary.btn-sm.editable-submit:hover {
   background-color: var(--bouton-hov-background);
   border-radius: var(--radius);
}

/* -- Bouton Close -- */
/* ------------------------- */

.close {
   margin-top: 0px;
   text-shadow: unset;
}
.alert-dismissible .close {
   padding: 14px 15px 10px 15px;
}


/* -- Volet de Droit + ( au passage de la souris) -- */
/* ----------------------------------------------------------------- */

#accordion-actions {
   right: -7px;
}

#accordion-actions ul li div.btn-accordion {
   transition: width var(--transition);
}

#accordion-actions ul li a, #accordion-actions ul li button:not(.btn-tampon) {
   background-color: var(--menu-backdground);
   transition: var(--transition);
}
#accordion-actions ul li a:hover, #accordion-actions ul li button:not(.btn-tampon):hover {
   background-color: var(--bouton-hov-background);
   transition: var(--transition);
}

/* -- Bouton Telecharger pour visualiser/ Consultatier texte intergrale -- */
/* ---------------------------------------------------------------------------------------------------- */

.section-content.section-shadow.hal-visualize-button.widget-files{
   background-color: var(--bouton-2-background)!important;
   transition: var(--transition);
}

.section-content.section-shadow.hal-visualize-button.widget-files:hover {
   background-color: var(--bouton-hov-background)!important;
}


/* -- Bouton / Consultatier sur Software Heritage */
/* ------------------------------------------------------------------- */

div.section-content:nth-child(1) > a:nth-child(1){
   color: var(--texte-color-btn)!important;
}

div.section-content:nth-child(1) > a:nth-child(1) > img:nth-child(1) {
   filter: brightness(0%) invert(100%);
}

/* -- Couleur texte fichier non deposer -- */
/* ------------------------------------------------------ */

.section-content.widget-files div.file.not {
   fill: var(--texte-color-btn);
   color: var(--texte-color-btn);
   cursor: default;
}

/* -- Background + En-tête Apercus et Historique -- */
/* --------------------------------------------------------------------- */

.panel-doc > button:first-child {
   background-color: var(--bouton-3-background) !important;
   color: var(--texte-color-btn) !important;
   border-radius: var(--widget-radius-top) !important;
}

.panel-doc .panel-doc-detailed {
   background-color: var(--body-background);
   border-radius: 0px 0px 12px 12px;
}

#history-detailed {
   border: 0px solid #e8e8e8;
   background-color: var(--body-background);
   border-radius: 0px 0px 12px 12px;
}

/* -- Label badge Historique -- */
/* ---------------------------------------- */

.badge {
   padding: 7px 10px 4px 10px;
}

.alert-history, .alert-history .badge {
   border-radius: var(--widget-radius)!important;
}
.alert-history .badge.badge-violet {
   background-color: var(--bouton-3-background);
   color: var(--texte-color-btn);
}
.alert-history .badge.badge-info {
   background-color: var(--bouton-background);
   color: var(--texte-color-btn);
}


.alert-history .badge.badge-warning, .alert-history .badge.badge-danger, .alert-history .badge.badge-success {
   padding: 4px 10px 5px 10px;
   color: var(--texte-color-btn);
}

/* -- Historique -- */
/* --------------------- */

.alert {
   border: var(--widget-border) !important;
   background-color: var(--widget-background);
}

.history {
   border: 0px solid var(--bouton-hov-background)!important;
   border-top: 1px solid var(--bouton-hov-background)!important;
}

/* -- Texte sous contact du déposant -- */
/* --------------------------------------------------- */

.submitted-date {
   background-color: var(--widget-background);
   border-radius: var(--widget-radius);
   padding: var(--widget-padding);
   box-shadow: var(--box-shadow);
   color: var(--texte-color);
   padding-top: 15px;
}


/* -- Nom du déposant style bouton -- */
/* --------------------------------------------------- */

.submitted-date > p:nth-child(1) > a:nth-child(1), .submitted-date > p:nth-child(1) > a:nth-child(2){
   background-color: var(--bouton-3-background);
   line-height: 2.5rem !important;
   display: inline-block !important;
   padding: 3px 12px 0px;
   margin-top: 5px;
   color: var(--texte-color-btn);
   border-radius: var(--radius);
   transition: var(--transition);
}
.submitted-date > p:nth-child(1) > a:nth-child(1):hover, .submitted-date > p:nth-child(1) > a:nth-child(2):hover{
   background-color: var(--bouton-hov-background);
}

/* -- Liens de la PJ style bouton + Icon avant -- */
/* -------------------------------------------------------------- */

tr.files > td:nth-child(2) > a:nth-child(2) > strong:nth-child(2) {
    background-color: var(--bouton-background) !important;
    border-radius: var(--radius) !important;
    padding: 5px 8px;
    color: var(--texte-color-btn);
}

tr.files > td:nth-child(2) > a:nth-child(2) > strong:nth-child(2)::before {
    content: "\e901";
    font-family: 'icomoon';
    color: #var(--texte-color-btn);
    margin-right: 10px;
    font-weight: lighter;
}

/* ============================= Page depot ============================= */
/* ------------------------------------------------------------------------------------------------------------------------- */
/* ------------------------------------------------------------------------------------------------------------------------- */

/* ========================== Page depot (Menu) ========================== */
/* ------------------------------------------------------------------------------------------------------------------------- */

/* -- Menu de Gauche + ( au passage de la souris) -- */
/* ----------------------------------------------------------------------- */

#list-item-deposit {
    position: fixed;
    background-color: var(--widget-background);
    box-shadow: var(--box-shadow);
    margin: var(--widget-margin);
    padding-top: 40px;
    padding-bottom: .5rem;
    border-radius: var(--widget-radius);
}

#list-item-deposit li a {
    display: flex;
    font-family: noto sans;
    transition: var(--transition);
    border-left: 5px solid var(--widget-background);
    padding: 8px 20px;
    color: var(--texte-color);
}

#list-item-deposit li a:hover {
    border-color: var(--bouton-background);
    background-color: var(--bouton-hov-3-background);
}

/* -- Texte Hover -- */
/* ----------------------- */

#list-item-deposit li:hover a {
    color: var(--texte-action-color);
}

/* -- Bouton Active -- */
/* -------------------------- */

#list-item-deposit li.active a {
    color: var(--texte-action-color);
    border-color: var(--bouton-hov-background);
    background-color: var(--bouton-hov-3-background);
}

/* ================== Page depot (Menu rubriques a gauche) ================= */
/* ------------------------------------------------------------------------------------------------------------------------- */

/* -- Specifique aux 3 rubriques -- */

#list-item-deposit li.active.child-item, #list-item-deposit li:hover {
    background-color: transparent;
}

/* Marge et padding entre les 3 rubriques du menu*/

#list-item-deposit li.main-item:not(first-child) {
    margin: 0px;
}
#list-item-deposit li {
    padding: 0px;
}
#list-item-deposit li.child-item {
    margin-top: 0px;
    padding: 0px;
}

/* =================== Page depot (Icone Menu rubriques) =================== */
/* ------------------------------------------------------------------------------------------------------------------------- */

/* -- Icone devant les rubriques du menu -- */
/* ---------------------------------------------------------- */

.nav-item-file::before, li.main-item:nth-child(2) > a:nth-child(1)::before, .nav-item-recap::before, .nav-item-extract::before, .nav-item-author::before, .nav-item-mainmeta::before, .nav-item-related::before, .nav-item-funding::before, .nav-item-meta::before  {
    font-family: icomoon;
    width: 30px;
}
.nav-item-file::before {
    content: "\e906";
}
li.main-item:nth-child(2) > a:nth-child(1)::before {
    content: "\e935";
}
.nav-item-recap::before {
    content: "\e941";
}
.nav-item-extract::before {
    content: "\e920";
}
.nav-item-author::before {
    content: "\e997";
}
.nav-item-mainmeta::before {
    content: "\e918";
}
.nav-item-related::before {
    content: "\e984";
}
.nav-item-funding::before {
    content: "\e958";
}
.nav-item-meta::before {
    content: "\e940";
}

/* ============== Page depot Texte (form control/zone de saisie)  =============== */
/* -------------------------------------------------------------------------------------------------------------------------- */

/* -- Info Principale (obligatoire et ne peut être vide) -- */
/* -------------------------------------------------------------------------- */

.extract-info > div.errors, .author-info > div.errors, .mainmeta-info > div.errors, .related-info > div.errors, .file-info > div.errors {
    color: var(--texte-color-label);
    background-color: var(--bouton-hov-background);
    padding: 20px 10px 10px 10px;
}
.close-error-info, .close-error-info:hover { 
    color: var(--texte-color-btn)!important;
}
.extract-info > div.errors > ol, ul, dl {
    margin-bottom: 0px;
}
.mainmeta-info {
    margin-top: -7px;
}

/* -- Zone de texte Résumé (form control) -- */
/* ----------------------------------------------------------- */

.linkify.text-break.multiTextAreaLang.editable.editable-pre-wrapped.editable-click {
   display: inline-block;
   padding: 0px;
    width: 97%;
    line-height: 20px;
}



/* -- Zone de Saisie (Forme control) affiliation auteur -- */
/* --------------------------------------------------------------------------- */

div.authors .author-affiliations .searchStructure {
    background: #fff;
    border-radius: var(--radius) !important;
}

div.authors .author-affiliations > ul {
    list-style: none;
}

/* -- Texte Box Calendrier  -- */
/* ------------------------------------ */

.datepicker {
    background: revert !important;
}

/* -- Icone Calendrier  -- */
/* ------------------------------ */

.calendar-trigger {
    background-color: var(--bouton-2-background);
    border-radius: 0px 5px 5px 0px;
    line-height: 5px;
    top: 0px;
    left: 0px;
    transition: var(--transition);
}
.calendar-trigger:hover {
    background-color: var(--bouton-hov-background);
}

.calendar-trigger .icon-calendar::before {
    color: var(--texte-color-btn);
}

/* ======================== Page depot (Doc Type) ========================= */
/* -------------------------------------------------------------------------------------------------------------------------- */

/* -- Selection Doc Type -- */
/* --------------------------------- */

#modal-typdoc .modal-dialog .typdoc-btn-group.selected {
    background-color: var(--bouton-hov-2-background);
}


/* -- Text Changer Doc Type / vider saisie -- */
/* ---------------------------------------------------------- */

.hal-secondary-button span, a.hal-secondary-button span {
    color: var(--texte-action-color);
}
.hal-secondary-button:hover, .hal-secondary-button:hover span, a.hal-secondary-button:hover, a.hal-secondary-button:hover span {
    color: var(--texte-action-hov-color);
}
.color-black {
    color: var(--texte-color) !important;
}

/* -- Text Quite, affecte aussi le texte red de la recap -- */
/* --------------------------------------------------------------------------- */

.red, .red::before {
    color: var(--texte-action-color) !important;
}

/* -- Fenetre Changement de DocType (couleur titre) -- */
/* --------------------------------------------------------------------------- */

#modal-typdoc .modal-dialog .modal-header .modal-title {
    color: var(--texte-action-color);
}
#modal-typdoc .modal-dialog .typdoc-btn-group .btn-typdoc:hover {
    color: var(--texte-color-btn);
}

/* -- Fenetre Changement de DocType (background) -- */
/* --------------------------------------------------------------------------- */

.modal-content {
    background-color: var(--widget-background);
    border-radius: var(--widget-radius);
    box-shadow: var(--box-shadow);
}

/* -- Fenetre Changement de DocType (largeur) -- */
/* -------------------------------------------------------------------- */

#modal-typdoc .modal-dialog .typdoc-btn-group .btn-typdoc {
    width: 90%;
    color: var(--texte-color);
}

/* -- Fenetre Changement de DocType (bouton) -- */
/* -------------------------------------------------------------------- */

#modal-typdoc .modal-dialog .typdoc-btn-group {
    background: var(--bouton-hov-2-background);
    border-radius: var(--widget-radius);
    transition: var(--transition);
}
#modal-typdoc .modal-dialog .typdoc-btn-group:not(.selected).btn:focus, #modal-typdoc .modal-dialog .typdoc-btn-group:not(.selected):hover {
    background: var(--bouton-hov-background);
}


/* -- Fenetre Changement sous menu -- */
/* ----------------------------------------------------- */

#modal-typdoc .modal-dialog .typdoc-btn-group .dropdown-menu {
    background: var(--widget-background);
    box-shadow: var(--box-shadow);
    padding: var(--widget-padding);
    border-radius: var(--widget-radius);
}

/* -- Fenetre Changement de DocType ( +Couleur texte - sous menu + au passage de la souris) -- */
/* --------------------------------------------------------------------------------------------------------------------------------------- */

#modal-typdoc .modal-dialog .typdoc-btn-group .dropdown-menu .dropdown-item:not(:last-child) {
    border-bottom: 1px solid var(--bouton-3-background);
}

#modal-typdoc .modal-dialog .typdoc-btn-group .dropdown-menu .dropdown-item {
    color: var(--texte-color);
}

#modal-typdoc .modal-dialog .typdoc-btn-group .dropdown-menu .dropdown-item:hover {
    color: var(--texte-action-hov-color);
}

/* ========================= Page depot (Bouton) ========================== */
/* -------------------------------------------------------------------------------------------------------------------------- */

/* -- Bouton [+Ajouter] + (au passage de la souris) -- */
/* ----------------------------------------------------------------------- */

.form-meta .row .input-group span.input-group-btn button {
    background-color: var(--bouton-2-background);
    border-radius: var(--radius);
    color: var(--texte-color-btn)!important;
}
.form-meta .row .input-group span.input-group-btn button:hover {
    background-color: var(--bouton-hov-background);
}

/* -- Bouton [+Supprimer] + (au passage de la souris) --*/

.form-meta .row .input-group span.input-group-btn button.form-btn-del {
    background-color: var(--bouton-background) !important;
    color: var(--texte-color-btn) !important;

}
.form-meta .row .input-group span.input-group-btn button.form-btn-del:hover {
    background-color: var(--bouton-hov-background)!important;
}

/* -- Responsive decalage du Bouton +Ajouter -- */
/* ------------------------------------------------------------------ */

@media (max-width: 1525px) {

div.form-group.row span.input-group-btn {
    margin-left: 0px;
}
}

/* -- Marge interne du Bouton [+Ajouter] -- */
/* ---------------------------------------------------------- */

.pb-2, .py-2 {
    padding: 10px 12px 6px 12px !important
}

.btn.btn-sm.btn-primary.form-btn-multi.form-btn-del:hover{
    background-color: var(--bouton-hov-background);

}
/* -- Bouton [-Supprimer] + (au passage de la souris) -- */

.form-meta .row .textarea-group .pull-right button.form-btn-del {
    color: var(--texte-color-btn) !important;
    transition: var(--transition);
}
.btn.btn-sm.btn-primary.form-btn-multi.form-btn-del:hover{
    background-color: var(--bouton-hov-background);

}

/* -- Bouton Quitter -- */
/* ---------------------------- */

.btn-primary-red.mt-4 {
    background: var(--bouton-2-background);
    border: 1px solid var(--bouton-2-background);
    border-radius: var(--radius);
    transition: var(--transition);
}
.btn-primary-red.mt-4:hover{
    background: var(--bouton-hov-background);
    border: 1px solid var(--bouton-hov-background);
}

/* -- Bouton Quitter dans la fenetre [Vous êtes sur le point de quitter la procédure de dépôt dans HAL]  + passage de la souris -- */
/* ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */

/* -- Bouton Annuler -- */
/* ----------------------------- */

.btn.hal-visualize-button.cancel {
    background-color: var(--bouton-2-background);
}
.btn.hal-visualize-button.cancel:hover {
    background-color: var(--bouton-hov-background);
}

/* -- Bouton Quitter -- */
/* --------------------------- */

.hal-warning-button {
    background-color: var(--bouton-background);
    padding: 14px 40px 7px;
    border-radius: var(--radius);
}

/* -- Btn verifier avant  deposer + (au passage de la souris) --*/
/* ---------------------------------------------------------------------------------- */

#verif-deposit {
    background-color: var(--bouton-background);
    color: var(--texte-color-btn);
    font-size: 16px;
    border: unset;
    border-radius: var(--widget-radius);
    transition: var(--transition);
}

#verif-deposit:hover {
    background-color: var(--bouton-hov-background);
}

/* -- Zone et Bouton Auteurs et affiliations  (+passage de la souris) -- */
/* ----------------------------------------------------------------------------------------------- */

.step-author-actions {
    background: var(--widget-background);
    padding: 0px 0px 10px;
    border-radius: 0px 0px 12px 12px;
}

.btn.btn-add-authors-list.btn-norender, .btn.btn-add-authors-struct.btn-norender, .btn.btn-add-my-authors.btn-norender, #affiliate_authors, #deaffiliate_authors {
    background-color: var(--bouton-2-background);
    color: var(--texte-color-btn);
    padding: 9px 14px 4px 14px;
    margin-top: 5px;
    border-radius: var(--radius);
    transition: var(--transition);
}
.btn.btn-add-authors-list.btn-norender:hover, .btn.btn-add-authors-struct.btn-norender:hover, .btn.btn-add-my-authors.btn-norender:hover, #affiliate_authors:hover, #deaffiliate_authors:hover {
    background-color: var(--bouton-hov-background);
}

/* ========================== Page depot (block) =========================== */
/* -------------------------------------------------------------------------------------------------------------------------- */

.navbar.navbar-expand-lg.navbar-dark.sub-header.deposit-header{
   box-shadow: var(--box-shadow) !important;
}

/* -- Corps -- */
/* -------------- */

.section-shadow {
    background-color: var(--widget-background)!important;
    box-shadow: var(--box-shadow)!important;
    margin: var(--widget-margin)!important;
    border-radius: var(--widget-radius);
}

/* -- En-tête -- */
/* ---------------- */

.submission-form .submit-step .step-title {
    background: var(--bouton-4-backdground);
    color: var(--texte-color-btn);
    border-radius: var(--widget-radius-top);
    padding: 15px 36px 10px;
}

#step-file, #panel-extract > h2:nth-child(1), #step-recap {
    background-color: var(--bouton-3-background);
    padding: 10px 0px 5px 10px;
    border-radius: var(--widget-radius);
    color: var(--texte-color-btn);
}

.submission-form h2 small {
    color: var(--texte-color-btn);
}


/* -- Ajout d'un En-tete au Drag'n'Drop -- */
/* ------------------------------------------------------ */

.section-shadow.step.p-4::before {
    color: var(--texte-color-label);
    content: "Glisser-déposer";
    font-size: 1.15rem;
    position: absolute;
    padding: 5px 15px 0px 15px;
    background-color: var(--bouton-4-backdground);
    width: calc(100% - 30px);
    border-radius: var(--widget-radius-top);
    left: 15px;
    top: 48px;
    padding: 15px 36px 10px;
    font-weight: 700;
}


/* -- FormControl/Input zone de saisie de texte -- */
/* ------------------------------------------------------------------- */

form input.form-control, .form-meta .row textarea, .form-meta .row .selection, .form-controln, .form-meta .row select, #date-id, #writingDate-id, #edate-id, #aut_new #searchAuthor, .load-by-id.input-group button, .load-by-id.input-group input {
    border: 1px solid var(--bouton-2-background) !important;
    background-color: var(--form-control)  !important;
    color: var(--texte-color);
}

/* -- Zone de texte (form control) -- */
/* ---------------------------------------------- */

form input.form-control:focus, .form-meta .row textarea:focus, .form-meta .row .selection:focus, .form-control:focus, .form-meta .row select:focus, #date-id:focus, #writingDate-id:focus, #edate-id:focus, #aut_new #searchAuthor:focus, .load-by-id.input-group button:focus, .load-by-id.input-group input:focus {
    box-shadow:unset!important;
    border-color: var(--label-bg-color)!important;
}

.select2-container--default {
    border: unset;
}
.select2-container--default .select2-selection--multiple, .select2-container--default .select2-selection--single,.form-meta .row #select2-mainDomain-container:empty {
    background-color: transparent!important;
}

/* -- Suppression de l'ascenseur dans la saisie des auteurs  -- */
/* ------------------------------------------------------------------------------------ */

div.authors {
    max-height: initial!important;
    overflow-y: auto;
}

/* -- Style des zone auteurs -- */
/* --------------------------------------- */

div.authors .author-icon-drag, div.authors .author-icon-edit, div.authors .author-info, div.authors .author-affiliations {
    background: var(--body-background);
}

div.authors .author-remove { /* Celui-ci est l'endroit ou il y a la corbeil*/
    background: var(--body-background);
}

/* -- Decalage du bouton drag and drop ::: -- */
/* ------------------------------------------------------------ */

.icon-drag::before {
    margin-left: 3px;
}


/* -- Style du bouton [...] Affilation + au passage de la souris -- */
/* -------------------------------------------------------------------------------------- */

.icon-more::before {
    background-color: var(--bouton-hov-2-background);
    border: 1px solid var(--bouton-2-background);
    padding: 8px 6px 8px 6px;
    border-radius: 0px 3px 3px 0px;
    position: absolute;
    top: -5px;
    right: -10px;
    transition: var(--transition);
}
.icon-more:hover::before{
    background-color: var(--bouton-2-background);
    color: var(--texte-color-btn);
}


/* -- Degalage du bouton [...] -- */
/* ---------------------------------------- */

div.authors .author-affiliations .structure-menu {
    top: 5px;
}


/* -- Style des afiiliations auteurs -- */
/* ----------------------------------------------- */

.structure-name.valid, .structure-name.old , .structure-name.incoming {
    display: flex;
    margin-bottom: 0.5rem !important;
    padding: 5px 10px 5px 10px;
    border-radius: var(--radius);
    font-family: Noto Sans,sans-serif;
    transition: var(--transition);
}
.structure-name.valid:hover, .structure-name.old:hover, .structure-name.incoming:hover {
    filter: brightness(110%);
}

.structure-name.valid {
    background-color: #c9eac0;
    color: #274b1e;
    border: 1px solid #879d81;
}
.structure-name.old {
    background-color: #eee7c0;
    color: #504B26;
    border: 1px solid #ccc6a5;
    font-weight: 700;
}
.structure-name.incoming {
    background-color: #ecc0c0;
    color: #4b1e1e;
    border: 1px solid #9b7e7e;
    font-weight: 700;
}



/* Icone Drag and Drop avant affiliation */
/* ------------------------------------------------------ */

.authors .structure-name::before {
    content: "\e919";
    font-family: 'icomoon';
    color: #000;
    margin-right: 10px;
    font-weight: lighter;
    cursor: move;
}

.structure-name.valid, .referential.valid {
    width: 100%;
}

/* Marge du symbole avant le logo de l'affiliation */
/* ------------------------------------------------------------------- */

.icon-institution::before {
    margin-right: 5px;
    line-height: 1.4;
}

/* -- Drag&Drop zone Auteur -- */
/* ----------------------------------------- */

div.authors .author-icon-drag {
    padding-left: 17px !important;
    border-right: 5px solid var(--widget-background);
}

/* -- Zone  saisie Auteur separation -- */
/* -------------------------------------------------- */

.author-affiliations.col-7 {
    border-left: 5px solid var(--widget-background);
}

/* -- Responsive entre les 3 [Left Mid Right] Blocks sur Page +Deposer -- */
/* ---------------------------------------------------------------------------------------------------- */

@media (min-width: 992px) {
.col-lg-2 {
    flex: 0;
    max-width: unset;
    min-width: 250px;
}

.col-lg-8 {
    flex: 1;
}
}

@media (min-width: 1280px) {
.col-lg-8 {
    max-width: 100%;
}
}

/* --  Marge de la page +déposer -- */
/* ---------------------------------------------- */

.m-deposit {
    margin: 15px 30px 10px 30px;
}

/* --  Tag/Bouton Domaine -- */
/* -------------------------------------- */

.select2-container--default .select2-selection--single .select2-selection__rendered {
    background-color: var(--bouton-background) !important;
    color: var(--texte-color-btn) !important;
    border-radius: var(--radius) !important;
    padding: 5px 10px 0px !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: var(--bouton-background) !important;
    border-radius: var(--radius) !important;
    color: var(--texte-color-btn) !important;
    padding: 8px 10px 4px !important;
}

/* --  Block Nom de la revue -- */
/* --------------------------------------- */

blockquote .referentiel {
    border: var(--widget-border);
    padding: 10px;
    border-radius: var(--radius);
}

/* ======================== Page depot Drag&Drop ========================= */
/* -------------------------------------------------------------------------------------------------------------------------- */

/* -- Zone avec fichier -- */
/* ------------------------------ */

#div-files {
    background-color: var(--widget-background) !important;
    padding: 0px 0px 0px !important;
    border-radius: 0px 0px 12px 12px;
}

/* -- Zone avec fichier tableau -- */
/* ------------------------------------------ */

.row-file.file-main {
    background: var(--widget-background);
}
#div-files .section-shadow th:not(:last-child) {
    box-shadow: unset;
    background-color: var(--widget-background);
    border-bottom: 1px solid var(--bouton-background);
}
.row-file.file-main .details, .row-file td.delete, #div-files .section-shadow th:last-child {
    background: var(--widget-background);
}
#div-files .section-shadow th:last-child{
    border-bottom: 1px solid var(--bouton-background);
}
.row-file.file-main {
    border-bottom: 0px solid;
}

/* -- Icon inutile sous la zone -- */
/* ----------------------------------------- */

.icon-point-up::before {
content: "";
}

/* -- Decalage du Drag'n'Drop pour l'en-tete -- */
/* -------------------------------------------------------------- */

.section-shadow.step.p-4 {
    margin-top: 54px;
    padding: 0px 0px 0px 0px!important;
}
/* -- Couleur de l'icon Cloud -- */
/* --------------------------------------- */

.upload-area .icon-upload {
    color: var(--texte-action-color);
}

/* -- Couleur du lien URL -- */
/* ---------------------------------- */

.btn-link {
    color: var(--texte-action-color);
}
.btn-link:hover {
    color: var(--texte-action-hov-color);
}

/* -- Zone Upload du lien URL -- */
/* ----------------------------------------- */

.upload-area {
    border: 1px solid transparent;
    border-bottom: 1px solid var(--bouton-background);
    transition: var(--transition);
    border-radius : 0px;
    margin-top: 60px;
}  
.upload-area:hover {
    background-color: var(--bouton-4-backdground);
    transition: var(--transition);
}

/* -- Bouton dans la fenetre Televerser lien URL -- */
/* ------------------------------------------------------------------- */

.btn-primary-darkblue {
    background-color: var(--bouton-2-background);
    color: var(--texte-color-btn);
    border-radius: var(--radius);
    padding: 6px 22px 3px !important;
    transition: var(--transition);
}
.btn-primary-darkblue:hover {
    background-color: var(--bouton-hov-background);
}

/* ======================== Page depot Drop Down ========================= */
/* -------------------------------------------------------------------------------------------------------------------------- */

/* -- Couleur des DropDown -- */
/* ---------------------------------------- */

.form-meta .row .textarea-group > button.dropdown-toggle {
    background: var(--bouton-2-background) !important;
    border: 1px solid var(--bouton-2-background) !important;
}


/* -- Couleur des DropDown Doi etc... -- */
/* ----------------------------------------------------- */

#identifiertype {
    background: var(--bouton-2-background) !important;
    color: var(--texte-color-btn);
    line-height: 1px;
    border-radius: var(--dropbtn-border-radius);
    border: 1px solid var(--bouton-2-background);

}

/* -- Forme (radius) des DropDown -- */
/* -------------------------------------------------- */

.form-meta .row .input-group .form-btn-lang {
    border-radius: var(--dropbtn-border-radius);

}

/* -- DropDown saisie de role zone auteurs -- */
/* ------------------------------------------------------------- */

div.authors .div-author-role select {
    background: #fff;
    font-size: 12px;
    border: 1px solid #a2a2a2;
    padding: 6px 10px 2px;
    border-radius: var(--radius);
}

/* -- DropDown menu action sur les affiliations zone auteurs -- */
/* --------------------------------------------------------------------------------------- */

.dropdown-item {
    padding: 7px 10px 3px 10px;
}

.dropdown-item:focus, .dropdown-item:hover {
    background-color: var(--bouton-background);
    color: var(--texte-color-btn);
    border-radius: var(--radius);
}

/* -- DropDown menu action classification et mot cle (JEL) -- */
/* ---------------------------------------------------------------------------------- */

.select2-container--default .select2-results__option--highlighted[aria-selected] > span.item-label, .select2-container--default .select2-results__option--highlighted[aria-selected]:hover > span.item-label {
    background-color: var(--bouton-hov-3-background) !important;
    color: var(--texte-action-color) !important;
}

/* ========================== Page depot Recap =========================== */
/* -------------------------------------------------------------------------------------------------------------------------- */


/* -- Style du Recap Invalide -- */
/* --------------------------------------- */

.invalid-steps {
    border: 2px solid var(--label-bg-color);
    border-radius: var(--radius);
}

/* =================== Page depot Fenetre Detail Affiliation =================== */
/* -------------------------------------------------------------------------------------------------------------------------- */

/* -- Titre de la box -- */
/* -------------------------- */

#modal-author .modal-dialog .modal-content, #modal-ref .modal-dialog .modal-content {
    color: var(--texte-action-color);
}
#modal-typdoc .modal-dialog .modal-header {
    background: transparent;
}
/* -- Padding dans la box -- */
/* ----------------------------------- */

#modal-author .modal-dialog .modal-body, #modal-ref .modal-dialog .modal-body {
padding: 5px 25px;
}

/* -- Label du type de l'affiliation et l'id -- */
/* ------------------------------------------------------ */

.structure-element-researchteam, .structure-element-laboratory, .structure-element-regroupinstitution, .structure-element-institution {
    border: var(--widget-border) !important;
    padding: 2px 10px 5px 10px;
    color: var(--texte-color);
    transition: var(--transition);
    border-radius: var(--radius);
}

#modal-author .modal-dialog .modal-content .label, #modal-ref .modal-dialog .modal-content .label {
    color: var(--texte-color-btn);
    border-radius: var(--radius);
    background-color: var(--bouton-2-background);
    padding: 7px 10px 4px 10px;
}

#modal-author .modal-dialog .modal-content h6 .label-rgpinst, #modal-ref .modal-dialog .modal-content h6 .label-rgpinst{
    background-color: var(--bouton-2-background);
    padding: 8px 10px 5px 10px;
}

#modal-author .modal-dialog .modal-content h6 .badge, #modal-ref .modal-dialog .modal-content h6 .badge {
    color: var(--texte-color-btn);
    border-radius: var(--radius);
    background-color: var(--bouton-background);
    padding: 8px 10px 5px 10px;
}

/* -- Background et texte des items au passage de la souris -- */
/* ------------------------------------------------------------------------------------- */

.structure-element-laboratory:hover, .structure-element-institution:hover, .structure-element-regroupinstitution:hover {
    background-color: var(--body-background)!important;
}

.structure-element-laboratory:hover h6, 
.structure-element-institution:hover h6 {
    color: var(--texte-color)!important;
}

/* -- Margin du texte description  -- */
/* ----------------------------------------------- */

small, .small {
    margin: 5px;
}

/* ============================= Page Resultat ============================ */
/* -------------------------------------------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------------------------------------------- */

/* -- Fix du Responsive par rapport au responsive de la page +depots -- */
/* --------------------------------------------------------------------------------------------------- */

@media (min-width: 992px) {
  .col-lg-10 {
    flex: 1;
}
}

/* ========================== Page Resultat Bouton ======================== */
/* -------------------------------------------------------------------------------------------------------------------------- */

/* -- Bouton Enregistrer la recherche -- */
/* ---------------------------------------------------- */

.results-header .btn-label {
    left: -19px;
    padding: 7px 11px;
    line-height: 11px;
}

/* ============================ Volet Resultat ============================ */
/* -------------------------------------------------------------------------------------------------------------------------- */

/* ========================== Styles des elements  ========================= */
/* -------------------------------------------------------------------------------------------------------------------------- */

/* -- Ajouts d'effet de Transition dans les resultats de la page Resultat  -- */
/* ---------------------------------------------------------------------------------------------------- */

.table-white tr {
    transition: var(--transition);
}

/* -- Background des items dans la liste des resultat + (au passage de la souris) -- */

#mydeposit tbody #ownsub tr, #partage_table tbody tr, .table-white tr {
    border-bottom: 1px solid var(--bouton-hov-background);
}

#mydeposit tbody #ownsub tr:focus, #mydeposit tbody #ownsub tr:hover, #partage_table tbody tr:focus, #partage_table tbody tr:hover, .table-white tr:focus, .table-white tr:hover {
    background-color: var(--bouton-hov-3-background);
    box-shadow: var(--box-shadow);
}

/* -- Background des labels Doctype -- */
/* --------------------------------------------------- */

.browse-filter, .doc-arxiv, .doc-identifier, .doc-orcid, .typdoc {
    background-color: var(--bouton-background);
    padding: 8px 10px 4px;
    border-radius: var(--radius);
}


/* -- Background des labels annee -- */
/* ------------------------------------------------ */

.header-section .journal, .header-section .year {
    background-color: var(--bouton-2-background);
    padding: 8px 10px 4px;
    border-radius: var(--radius);
    color: var(--texte-color-btn);
}

/* -- Couleur du texte Tries par a droite des boutons du numero de page -- */
/* -------------------------------------------------------------------------------------------------------- */

.dropdown-sort button {
    color: var(--texte-action-color);
}
.focus-round:focus, .focus-round:hover, .show > button[data-toggle-second="tooltip"].btn-secondary.dropdown-toggle, button[data-toggle-second="tooltip"]:focus, button[data-toggle-second="tooltip"]:hover {
    color: var(--texte-action-hov-color);
}


/* -- Couleur des 3 points Menu Hamburger -- */
/* --------------------------------------------------------------- */

.icon-actions::before {
    color: var(--texte-action-color);
}

/* -- Couleur de l'icone Favoris/Bookmark -- */
/* ----------------------------------------------------------- */

#bookmark-button, #bookmark-fill-button, .bookmark-button, .bookmark-fill-button {
    color: var(--texte-color);
}

.icon-bookmark::before {
    color: var(--texte-action-color);
}

/* -- Bouton Enregistrer Favoris/Bookmark -- */
/* ------------------------------------------------------------- */

#library_save-button{
    background-color: var(--bouton-2-background);
    border-radius: var(--radius)!important;
}

#library_save-button:hover {
    background-color: var(--bouton-hov-background);
}
/* -- Bouton/label Filtre resultat -- */
/* --------------------------------------------- */

.results-header > div:nth-child(2) .hal-bguser {
    background-color: var(--bouton-background);
    font-size: 0.9rem;
    font-weight: normal;
    padding: 5px 10px 2px 10px;
    border-radius: var(--radius);
}

/* ============================ Couleur Texte  ============================ */
/* -------------------------------------------------------------------------------------------------------------------------- */

/* -- Couleur du trait sour la barre de recherche Tri -- */
/* ------------------------------------------------------------------------- */

.secondary-search {
    border-bottom: 1px solid var(--bouton-background);
}

/* -- Couleur du texte dans la barre de recherche Tri -- */
/* -------------------------------------------------------------------------- */

#search-field {
color: var(--texte-color);
}

/* -- Couleur du texte Tri -- */
/* ---------------------------------- */

.sort {
    color: var(--texte-action-color);
}

/* -- Texte des auteurs (couleur) -- */
/* --------------------------------------------- */

.results-table .authors-results a {
    color: var(--texte-action-color);
}

/* -- Texte du sous titres (couleur et taille) -- */
/* ----------------------------------------------------------- */

.results-table .citation-results, .results-table .citation-results a {
    color: var(--texte-color);
    font-size: .9rem;
}

/* -- Texte supprimer au passage de la souris (couleur) -- */
/* ------------------------------------------------------------------------------ */

.red > span:nth-child(2):hover{
    color: var(--texte-color-btn);
}


/* -- Couleur du texte dans les resultats de la page Resultat  -- */
/* -------------------------------------------------------------------------------------- */

.strong.view-deposit {
    color: var(--texte-color) !important;
}
.center-text {
    color: var(--texte-color);
}

/* -- Couleur du texte dans les DropDown de Tri -- */
/* -------------------------------------------------------------------- */

.dropdown-menu {
    color: var(--texte-color);
}


/* ============================ DropDown Tri ============================ */
/* -------------------------------------------------------------------------------------------------------------------------- */

/* -- Padding du Menu Tri par -- */
[type="checkbox"]:checked + label, [type="checkbox"]:not(:checked) + label {
    padding: 10px 30px 2px;
}

/* -- Alignement des checkboxs du Menu Tri par -- */
/* -------------------------------------------------------------------- */

[type="checkbox"]:checked + label::before, [type="checkbox"]:not(:checked) + label::before {
    left: 4px;
    top: 6px;
}


/* =================== Page Notice Synthese et Moderation =================== */
/* -------------------------------------------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------------------------------------------- */

/* -- Titre de la fonction de la page -- */
/* ------------------------------------------------- */

/* -- Import de la font Inria -- */

.corps > h1:nth-child(1)  {
    background-color: var(--bouton-3-background);
    padding: var(--widget-padding);
    border-radius: var(--widget-radius);
    color: var(--texte-color-btn);
}

/* -- Style du fond des elements du block de gauche -- */

/* -- Version du document -- */
/* ------------------------------------- */

.bg-beige.versions.pt-1.pb-1 {
    background-color: transparent;
    color: var(--texte-color);
    text-align: center;
}
.bg-beige.versions span:first-child, .hal-bgtext.versions span:first-child {
    color: var(--texte-color)!important;
}
.bg-beige.versions span:nth-child(2) a, .hal-bgtext.versions span:nth-child(2) a {
    color: var(--texte-color-btn) !important;
    background-color: var(--bouton-3-background);
    padding: 3px 6px;
    border-radius: var(--radius);
}

/* -- Version du document identifiants -- */
/* ------------------------------------------------------ */

.identifier-list > ul:nth-child(1) > li:nth-child(1) > span:nth-child(2) {
    background-color: var(--bouton-background);
    padding: 4px 11px 2px;
    border-radius: var(--widget-radius);
    color: var(--texte-color-btn);
    display: inline-flex;
    width: fit-content;
}


/* -- Espace entre les differents ID label Doc DOI HAL etc... -- */
/* ------------------------------------------------------------------------------------ */

.identifier-list ul li {
    margin-bottom: 10px;
}


/* -- Texte Citation -- */
/* ------------------------- */

#citation {
    background-color: transparent;
}

/* ============== Styles des differents zones dans le block de droite ============= */
/* -------------------------------------------------------------------------------------------------------------------------- */

/* -- Label ID Unite et format du depot -- */
/* ------------------------------------------------------- */

.label.label-default {
    background: var(--bouton-3-background)!important;
    border-radius: var(--radius)!important;
    margin-bottom: 2px;
    line-height: 22px;
}
.structid.label.label-default {
    margin-bottom: 5px;
}
.structid.label.label-default {
    background: var(--bouton-background) !important;
}

/* -- Label Domain de qualification -- */
/* ------------------------------------------------- */

.metas.text-break.multiselect {
    background-color: var(--bouton-2-background);
    color: var(--texte-color-btn);
    padding: 3px 10px 4px 10px;
    border-radius: var(--radius);
}
/* -- Label Retour de Moderation -- */
/* ---------------------------------------------- */

.label.label-info {
    background: var(--menu-backdground)!important;
    border-radius: var(--radius)!important;
}

/* -- Label ArXiv -- */
/* ---------------------- */

.label.label-arxiv {
    background: var(--bouton-hov-background)!important;
    border-radius: var(--radius)!important;
}


/* -- Label ID Doc Type -- */
/* -------------------------------- */


.label.label-danger, .label.label-warning, .label.label-primary {
    border-radius: var(--radius)!important;
}

.label.label-danger {
    background-color: var(--bouton-background)!important;
}

.label.label-warning  {
    background-color: #ef7d25!important;
}

.label.label-primary {
    background-color: #1587c9!important;
}

/* -- Disposition ligne et Background Tableau -- */
/* ---------------------------------------------------------------- */

.btn-group, .btn-group-vertical {
    margin-bottom: 10px!important;
}

.table-bordered, .table-bordered td, .table-bordered th, .table tbody + tbody {
    border: 0px solid!important;
    border-top: 1px solid var(--bouton-hov-background) !important;
}

/* ============================== Block Auteur =========================== */
/* -------------------------------------------------------------------------------------------------------------------------- */

div.authors {
    background: var(--widget-background);
}
.authors {
    background-color: var(--widget-background);
}

.bg-beige {
    background-color: var(--body-background);
    border-radius: var(--radius);
}

/* -- Couleur texte auteurs en vue details et picto CVHAL -- */
/* --------------------------------------------------------------------------------- */

.col-lg-4 .bg-beige > a {
    color: var(--texte-action-color);
    font-weight: 700;
}

/* -- Picto CVHAL -- */
/* ----------------------- */

.col-lg-4 .bg-beige .detailed-resume {
    border: 1px solid var(--label-bg-color);
}
.col-lg-4 .bg-beige .detailed-resume a {
    color: var(--label-bg-color);
}

/* ============================== Block Resume =========================== */
/* -------------------------------------------------------------------------------------------------------------------------- */

/* -- Taille par defaut -- */
/* ----------------------------- */

.input-large {
    width: 41vw!important;
    height: 400px !important;
}

/* ============================= Block Affiliation ========================== */
/* -------------------------------------------------------------------------------------------------------------------------- */

.valid-struct, .incoming-struct, .old-struct {
    display: inline-block;
    padding: 1px 10px 1px 10px;
    border-radius: var(--radius);
    transition: var(--transition);
    width: 96%;
}

.valid-struct {
    background-color: #c9eac0;
    color: #274b1e!important;
    border: 1px solid #879d81;
}
.incoming-struct{
    background-color: #ecc0c0;
    color: #4b1e1e!important;
    border: 1px solid #9b7e7e;
}
.old-struct {
    background-color: #eee7c0;
    color: #504B26 !important;
    border: 1px solid #ccc6a5;
}

.structures {
    margin-top: 8px;
    padding: 8px 15px 5px;
}
.structures.bg-beige {
    background-color: var(--body-background);
}

/* -- Picto avant les affiliations -- */
/* ------------------------------------------- */

.structures div:first-child {
    color: var(--texte-color);
    top: 3px;
}

/* -- Numero avant affiliations -- */
/* ------------------------------------------- */

.structures div:nth-child(2) span {
    background-color: var(--bouton-background);
    padding: 3px 8px 1px;
    color: var(--texte-color-label);
    border-radius: var(--side-border-radius);
}

/* --  Couleur texte affiliation au passage de la souris -- */
/* --------------------------------------------------------------------------- */

#preview-doc .authors .btn-popover:hover, #preview-doc .structures .btn-popover:hover, section.flex-74 .authors .btn-popover:hover, section.flex-74 .structures .btn-popover:hover {
    color: var(--texte-action-hov-color);
}

/* -- Couleur du texte des structures dans la fenetre de detail -- */
/* ---------------------------------------------------------------------------------------- */

.popover-structure > a, .popover-structure ul a {
    color: var(--texte-color);
}
.popover-structure > a:hover, .popover-structure ul a:hover {
    color: var(--texte-action-hov-color);
}

/* ===================== Page Notice Synthese (bouton) ===================== */
/* -------------------------------------------------------------------------------------------------------------------------- */

/* -- Champs Modifiable en version boutton -- */
/* -------------------------------------------------------------- */

.editable-click, a.editable-click, a.editable-click:hover {
    background-color: var(--body-background);
    color: var(--texte-color);
    padding: 5px 6px 6px 6px;
    border-radius: var(--radius);
    border: 1px solid var(--bouton-3-background)!important;
    text-align: center;
    line-height: 34px;
}
.label.label-primary.metas.select-filemeta.editable.editable-click {
    border-color: #337AB7 !important;
    line-height: 22px;
}
.metas.text-break {
    display: flex;
    width: fit-content;
}

/* -- Annulation du champ en boutton pour resume -- */
/* -------------------------------------------------------------------------- */

.linkify.text-break.multiTextAreaLang.editable.editable-pre-wrapped.editable-click {
    background-color: unset;
    border: unset!important;
}

/* -- Domaines  -- */
/* --------------------- */

.domains a.hal-bgtext, .keywords a.hal-bgtext {
    background-color: var(--bouton-3-background);
    border-radius: var(--radius);
    transition: var(--transition);
}
.domains a.hal-bgtext:hover, .keywords a.hal-bgtext:hover {
    background-color: var(--bouton-hov-background);
}

/* -- Bouton Langue des Mots cles + Resume + Titre -- */
/* -------------------------------------------------------------------------- */

.abstract .btn-group button.btn.active, .keywords .btn-group button.btn.active, .btn-group-lang button.btn.active {
    background-color: var(--bouton-background);
    color: var(--texte-color-btn);
    border-radius: var(--radius);
    transition: var(--transition);
}
.abstract .btn-group button.btn.active:hover, .keywords .btn-group button.btn.active:hover, .btn-group-lang button.btn.active:hover{
    background-color: var(--bouton-hov-background);
}

.abstract .btn-group button.btn, .keywords .btn-group button.btn, .btn-group-lang button.btn {
    color: var(--texte-action-color);
    border: 1px solid var(--bouton-background);
    border-radius: var(--radius);
    padding: 5px 10px 3px 10px;
}

.btn-group > .btn:not(:last-child):not(.dropdown-toggle), .btn-group > .btn-group:not(:last-child) > .btn {
    border-top-right-radius: var(--radius);
    border-bottom-right-radius: var(--radius);
}

/* -- Exporter et Collection -- */
/* ------------------------------------- */

.hal-bgtext, a.hal-bgtext {
    line-height: 2.5rem!important;
    display: inline-block!important;
    padding: 3px 12px 0px;
    margin-top: 5px;
    background-color: var(--bouton-3-background);
    color: var(--texte-color-btn);
    border-radius: var(--radius);
    transition: var(--transition);
}
.hal-bgtext:hover, a.hal-bgtext:hover {
    background-color: var(--bouton-hov-background);
}

/* -- Halmetrics -- */
/* ---------------------- */

#metrics {
    border: 0px solid;
}


/* -- Bouton affichier plus de details  -- */
/* ---------------------------------------------------- */

.authors + button {
    border: 1px solid var(--bouton-background);
    color: var(--texte-action-color);
    padding: 7px 10px 3px;
    margin-top: 2px;
    border-radius: var(--radius);
}
.authors + button:hover {
    background-color: var(--bouton-hov-background);
    border: 1px solid var(--bouton-hov-background);
    color: var(--texte-color-btn);
}

#authors-detailed button.btn-hide-show {
    background-color: var(--bouton-background);
    border: 1px solid var(--bouton-background);
    color: var(--texte-color-btn);
    padding: 7px 10px 3px;
    border-radius: var(--radius);
}

/* ==================== Page Notice Moderation (bouton) ===================== */
/* -------------------------------------------------------------------------------------------------------------------------- */

/* -- Bouton Mettre en Ligne  -- */
/* ----------------------------------------- */

.btn.btn-primary.btn-action {
    background: var(--bouton-2-background);
    color: var(--texte-color-btn);
    margin-right: 5px;
    border: 0px;
    border-radius: var(--radius) !important;
}
/* -- Bouton Action Edition etc... -- */
/* --------------------------------------------- */

.btn.btn-default.btn-action {
    background-color: var(--bouton-hov-3-background) !important;
    color: var(--texte-color) !important;
    margin-right: 5px;
    border: 0px;
    border-radius: var(--radius) !important;
}

/* -- Bouton Supprimer -- */
/* -------------------------------- */

.btn.btn-danger.btn-action {
    background-color: var(--bouton-background);
    color: var(--texte-color-btn);
    margin-right: 5px;
    border: 0px;
    border-radius: var(--radius) !important;
}

/* -- En fontion hover -- */
/* ----------------------------- */

.btn.btn-primary.btn-action:hover, .btn.btn-danger.btn-action:hover, .btn.btn-default.btn-action:hover {
    background: var(--bouton-hov-background);
    border: 0px;
}

.btn.btn-default.btn-action:hover {
    background-color: var(--bouton-hov-background) !important;
    color: var(--texte-color-btn) !important;
}

/* -- Decalage du bouton filtre -- */
/* ------------------------------------------ */

#filtre {
    margin-bottom: 10px!important;
}

/* ============================== Page Profil ============================= */
/* -------------------------------------------------------------------------------------------------------------------------- */
/* -------------------------------------------------------------------------------------------------------------------------- */

/* -- Commun sur plusieur page -- */
/* --------------------------------------------- */

/* -- Box et Bouton Discipline -- */
/* ----------------------------------------- */

.select2-container--hal .select2-selection__choice {
    background-color: var(--bouton-3-background) !important;
    color: var(--texte-color-btn);
    border-color: var(--bouton-3-background) !important;
}
.select2-container .select2-selection--multiple {
    padding: 1px 0px 0px 1px;
}

/* -- Champs obligatoire -- */
/* ---------------------------------- */

.ccsd_form_required {
    color: var(--texte-action-color);
}

/* -- Boutons onlget -- */
/* ---------------------------- */

.section-content .nav-pills .nav-item .nav-link.active {
    color: var(--texte-action-color);
}
.section-content .nav-pills .nav-item .nav-link.active::before {
    border-bottom: 7px solid var(--bouton-background);
}


/* ============================ Tableau de bord =========================== */
/* --------------------------------------------------------------------------------------------------------------------------- */

/* -- Couleur des chiffres -- */
/* ----------------------------------- */

.stat-counter .counter-large {
    color: var(--texte-action-color);
}

/* -- Couleur des boutons -- */
/* ------------------------------------ */

.stat-graph .select-range-depot .btn.active, .stat-graph .select-range .btn.active, .stat-spinner .select-range-depot .btn.active, .stat-spinner .select-range .btn.active {
    background: var(--bouton-background);
    color: var(--texte-color-btn);
}
.stat-graph .select-range-depot, .stat-graph .select-range, .stat-spinner .select-range-depot, .stat-spinner .select-range {
    border: 2px solid var(--bouton-background);
}

/* -- Btn Telechargement -- */
/* ----------------------------------- */

.hal-option-button.btn-dark {
    background-color: var(--bouton-2-background);
    color: var(--texte-color-btn);
}

.hal-option-button.btn-dark:hover, .hal-option-button.btn-light:hover {
    background-color: var(--bouton-hov-background);
}

.hal-option-button.btn-light {
    background-color: var(--bouton-2-background);
    color: var(--texte-color-btn);
}

/* -- Statistique ESGBU -- */
/* -------------------------------- */

.bg-primary-color {
    background-color: var(--bouton-background) !important;
    border-radius: var(--widget-radius-top) !important;
}

/* ============================== Mon Profil ============================== */
/* --------------------------------------------------------------------------------------------------------------------------- */

/* -- Icon Avatar -- */
/* ---------------------- */

.user-circle.xlarge .initials {
   font-family: Noto Sans,sans-serif;
}

/* -- Mes Affiliation -- */
/* --------------------------- */

.section-shadow.pg-20 .displayed .select2-selection__choice, .ticket {
    background-color: var(--bouton-3-background);
    padding: 5px 15px 0px 15px;
    border-radius: var(--radius);
    color: var(--texte-color-btn);
    margin-bottom: 10px;
}


/* -- Checkbox -- */
/* -------------------- */

[type="checkbox"]:not(:checked) + label::after, [type="checkbox"]:checked + label::after {
    top: 1em;
    left: 0.4em;
}

/* -- Bouton Switch -- */
/* --------------------------- */

.switch .slider::before {
    background-color: var(--bouton-2-background);
}
.switch input:checked + .slider {
    background-color: var(--bouton-3-background);
}

/* ============================= Mon IDHAL ============================== */
/* --------------------------------------------------------------------------------------------------------------------------- */

/* -- Couleur des textes dans les boutons -- */
/* ---------------------------------------------------------- */

.btn.btn-sm.btn-default.form-btn-lang {
    color: var(--texte-color-btn);
}

/* =============================== Mon CV =============================== */
/* --------------------------------------------------------------------------------------------------------------------------- */

/* -- Label Langue -- */
/* ------------------------- */

ul.nav-pills.light-border a.active {
    background-color: var(--label-bg-color);
    color: var(--texte-color-btn);
    border-color: var(--label-bg-color);
    border-radius: var(--radius);
    padding: 5px 8px 4px 10px;
}
ul.nav-pills.light-border a {
    background-color: var(--bouton-2-background);
    color: var(--texte-color-btn);
    border: 1px solid var(--bouton-2-background);
    padding: 5px 8px 4px 10px;
    border-radius: var(--radius);
    transition: var(--transition);
}
ul.nav-pills.light-border a:not(.active):hover {
    background-color: var(--bouton-hov-background);
    border: 1px solid var(--bouton-hov-background);
}

/* -- Bouton Consulter/partage/crayon edition -- */
/* -------------------------------------------- */

.tools-color {
    color: var(--texte-action-color);
}
.wrapper-switch h3 button span {
    color: var(--texte-action-color);
}

/* -- Menu Mes Publications -- */
/* ---------------------------------------- */

/* -- Background du menu -- */
/* ------------------------------------- */

#user-publications #dragon-publi li, #user-publications #dragon-widget li, #user-facettes #dragon-publi li, #user-facettes #dragon-widget li {
    background-color: var(--bouton-hov-3-background);
}

/* -- Background de l'encadre au dessus des resultats -- */
/* ---------------------------------------------------------------------------- */

#user-publications #list-publi-resume table thead tr, #user-facettes #list-publi-resume table thead tr {
    background-color: var(--bouton-hov-3-background);
}

/* ========================== Administrer dans HAL ======================== */
/*  ------------------------------------------------------------------------------------------------------------------------- */
/*  ------------------------------------------------------------------------------------------------------------------------- */



/* ============================= Administrer ============================= */
/* -------------------------------------------------------------------------------------------------------------------------- */

/* -- Page Document en attente -- */
/* --------------------------------------------- */

#moderate {
    background-color: var(--widget-background);
}

/* -- Texte echange avec le deposant -- */
/* ---------------------------------------------------- */

.alert-warning {
    background-color: #fff6db!important;
    border-color: var(--widget-border)!important;
    color: var(--texte-color)!important;
}


/* -- Centre des inputs Gestion des doublons -- */
/* ---------------------------------------------------------------- */

div.col-md-5:nth-child(1) {
    flex: 0 0 50%;
    max-width: 50%;
}

/* ========================== Gestion des Doublons ======================= */
/* ------------------------------------------------------------------------------------------------------------------------- */

.col-md-6.alert.doc-radio.alert-success {
    background-color: #d4edda;
    border-color: #c3e6cb;
    color: #155724;
    border-left: 3px solid var(--widget-background);
    border-right: 3px solid var(--widget-background);
}
.col-md-6.alert.doc-radio {
    background-color: #edd4d4;
    border-color: #e6c3c3;
    color: #571515;
    border-left: 3px solid var(--widget-background);
    border-right: 3px solid var(--widget-background);
}

/* -- Bouton Fusion et hierarchiser -- */
/* ------------------------------------------------- */

.form-actions.text-center {
    margin-bottom: 10px;
}

#fusion, #hierarchiser {
    background-color: var(--bouton-2-background);
    color: var(--texte-color-btn);
    border: 0;
    border-radius: var(--radius);
    transition: var(--transition);
}

#fusion:hover, #hierarchiser:hover {
    background-color: var(--bouton-hov-background);
    border:  var(--bouton-hov-background);
}

#fusion:active, #fusion:focus, #fusion:focus-visible, #fusion:focus-within, #hierarchiser:active, #hierarchiser:focus, #hierarchiser:focus-visible, #hierarchiser:focus-within {
    background-color: var(--bouton-hov-background);
    box-shadow: none;
}
/* ================================ Footer ============================== */
/*  ------------------------------------------------------------------------------------------------------------------------- */
/*  ------------------------------------------------------------------------------------------------------------------------- */

/* -- Masquage du footer original -- */
/* ----------------------------------------------- */

#footer > div:nth-child(2){
    display:none;
}

/* -- Style et couleur du footer original -- */
/* ------------------------------------------------------ */

footer { 
    background: var(--footer-background-gradient) !important;
    margin-top: 0px;
    padding-top: 50px;
}

/* Style liste/texte footer + (au passage de la souris) -- */
/* -------------------------------------------------------------------------- */

footer li a { 
    color: var(--texte-color-footer);
    background-image: linear-gradient(currentColor, currentColor);
    background-position: 0% 100%;
    background-repeat: no-repeat;
    background-size: 0% 1px;
    transition: background-size 0.3s;
}

footer li a:focus, footer li a:hover { 
    color: var(--texte-color-hov-footer);
    background-size: 100% 1px;
    font-weight: 500;
}

 /* -- Séparateur du footer entre les élements  -- */
/* ------------------------------------------------------------------ */

div.col-sm-4:nth-child(2), div.col-sm-4:nth-child(3), div.col-sm-4:nth-child(6) {
    border-left: 1px solid rgba(255, 255, 255, 0.25);
    height: 175px;
}

div.col-sm-4:nth-child(4){ 
    border-left: 1px solid rgba(255, 255, 255, 0.25);
    border-right: 1px solid rgba(255, 255, 255, 0.25);
    height: 175px;
}
