@CHARSET "UTF-8";

/*=======================================================================================*/
/*======================================== @IMPORT  =====================================*/
/*======================================================================================*/

/* Ceci permet l'import de la font Inria ---------------------------------------------------------------------------- */
@import "https://files.inria.fr/dircom/extranet/fonts-inria-sans.css"; 

/*==========================================================================================*/
/*===================================== ROOT [VARIABLE]  ==================================*/
/*=========================================================================================*/

:root {

/* Variable qui agit sur les couleurs des bordures et le background des widgets ---------------------------------------------------------------------------------------------------------------------------*/
    --widget: #384257; 

/* Variable qui agit sur les couleurs du texte URL "lien" ---------------------------------------------------------------------------------------------------------------------------*/
    --texte-url: #e63312; 

/* Variable qui agit sur les couleurs du texte ---------------------------------------------------------------------------------------------------------------------------*/
    --texte: #444a52; 

/* Variable qui agit sur les couleurs du texte au passage de la souris ------------------------------------------------------------------------------------------------------------*/
    --texte-hover: #e63312;

 /* Variable qui agit sur les couleurs des labels des widgets tels que le nombre de text intégral ---------------------------------------------------------------------------------------------------------------------------*/
    --label:#e63312;

/* Variable qui agit sur les couleurs des menu et des menu déroulants ---------------------------------------------------------------------------------------------------------------------------*/
    --menu:#272f3d;

/* Variable qui agit sur les couleurs des boutons et les mots clés du widget mots clés ---------------------------------------------------------------------------------------------------------------------------*/
    --bouton:#6c6980; 

/* Variable qui agit sur les couleurs des boutons du menu ---------------------------------------------------------------------------------------------------------------------------*/
    --bouton-menu:#e63312; 

/* Variable qui agit sur les couleurs au passage du curseurs sur les éléments tels que les boutons et les mots clés  ---------------------------------------------------------------------------------------------------------------------------*/
    --hover: #8c88a6; 

/* Variable qui agit sur les couleurs au passage du curseurs sur le menu ----------------------------------------------------------------------------------------------------------------*/
    --hover-menu: #B9251A; 

/* Variable qui agit sur les couleurs au passage du curseurs sur le menu ----------------------------------------------------------------------------------------------------------------*/
    --hover-menu2: #384257; 

/* Variable qui permet une animation de transition au passage du curseur ---------------------------------------------------------------------------------------------------------------------------*/
    --transition: .3s cubic-bezier(.25,.8,.5,1); 

/* Rouge Inria  ---------------------------------------------------------------------------------------------------------------------------*/
    --rouge: #e63312; 

}

/*=======================================================================================*/
/*============================ CONTENUS MODIFIABLE (Mode Rapide) =========================*/
/*======================================================================================*/


/* Couleur du fond de la page ------------------------------------------------------------------------------------ */

body, html {
background-color: #e5e5e5;
}


/* ============================== FONT (POLICE) ============================== */

/* Importation de la font Inria-Sans ------------------------------------------------------------------------------------ */
body { 
    font-family: 'Inria Sans';
}

/* Couleur des liens ( URL-HTML) ------------------------------------------------------------------------------------ */
a { 
    color: var(--texte-url);
}

/* Annulation de la prise en compte de la font sur le bandeau supérieur de la page (logo hal, etc.) ------------------------------------------------------------------------------------ */
button, input, optgroup, select, textarea { 
    font-family: revert; 
}
.user-circle .initials {
font-family: "Noto Sans", sans-serif;
}

/* Texte INRIA-TEMPLATE + Annulation de la prise en compte de la font Inria------------------------------------------------------------------------------------ */
.text-ban {
    font-size: 24px;
    font-weight: bold;
    line-height: 50px;
    font-family: Noto Sans,sans-serif;
    color: #6d2065;
    display: flex;
    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: 535px 2px;
    background-position: 50%;
}


/* ============================== Titre & Paragraphes ============================== */

/* Style du Titre h1 ------------------------------------------------------------------------------------ */
.titre-h1 { 
    padding-left: 0px;
    /*border-bottom: 1px solid var(--texte);*/
    color: var(--texte);
    padding-top: 15px;
    text-align: center;
}

/* Style des paragraphe------------------------------------------------------------------------------------ */
.paragraphes { 
    font-size: 16px;
    line-height: 30px;
    color: var(--texte);
    padding: 10px 10px 10px 10px;
}

/* Taille de h3 ------------------------------------------------------------------------------------ */
.h3, h3 {
    font-size: 1rem;
}

/* =============================== Bannière ===============================*/

/* Style de la bannière [En-tête] ------------------------------------------------------------------------------------ */
.logo {
    background-size: auto;
    background-repeat: no-repeat;
    height: 250px;
    background-position-x: center;
    background-color: #e5e5e5;
    display: flex;
    justify-content: center;
    align-items: center;
}

/* ========================== Widgets -> Commun à tous ==========================*/

/* Marge externe et couleur de l'entête des widgets ------------------------------------------------------------------------------------ */
.section-corps .widget .widget-header { 
    /*background-color: var(--widget);*/
    background-color: transparent;
    padding-top: 15px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    color:#000;
}

/* Marge externe et couleur des bordures des widgets ------------------------------------------------------------------------------------ */
 .section-corps .widget {
    margin-bottom: 25px;
    /*border: 1px solid var(--widget);*/
    /* box-shadow: none; */
    /*border-radius: 7px*/
    border: 1px solid #c8cad0;
    box-shadow: 0 3px 4px #00000029;
    border-radius: 3px;
    background-color: #f7f7f7;
}
/* Marge externe et couleur des bordures du widgets Gros Plan ------------------------------------------------------------------------------------ */
.block-widget {
    border: 1px solid #c8cad0;
    box-shadow: 0 3px 4px #00000029;
    border-radius: 3px;
    background-color: #f7f7f7;
    margin-bottom: 25px;
}
/* Marge interne du contenu du widget Gros Plan ------------------------------------------------------------------------------------ */
.block-widget-contenu {
padding: 5px 20px 5px 20px;
}



/* Style de En-tete du widget info principal ------------------------------------------------------------------------------------ */
.block-titre {
    display: table;
    margin: 0px 0px 0px 0px;
    padding: 7px 16px 0px 16px;
    background-color: var(--bouton-menu);
    color: #ffffff;
    font-size: 23px;
    width: 100%;
    text-align: center;
}

/* ========================== Label (chiffres qui s'affichent dans le widget) ==========================*/

/* Bloc avec chiffres dans les des widgets ------------------------------------------------------------------------------------ */
.label.label-contrast { 
    background-color: var(--label);
    color: #fff;
    padding: 11px 20px 8px;
    border-radius: 4px;
    font-size: 16px;
}

/* ========================== Widget -> dernière publication ========================== */

/* Style des éléments dans le 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;
}

/* Style du widget dernière publication hover -> (au passage de la souris) ------------------------------------------------------------------------------------ */
.list-deposit .media:hover {  
    border-color: var(--widget);
    background-color: #cdd0d3;
    transform: translatey(-5px);
}

/* Marge interne des éléments du widget dernière publication ------------------------------------------------------------------------------------ */
.list-deposit { 
    padding: 10px 10px;
}

/* Marge externe du texte du widget dernière publication ------------------------------------------------------------------------------------ */
.media-body { 
    margin-left: 10px;
}


/* --------------------------------------------- Widget avec Graphique --------------------------------------------- */

rect { /* Pas de fond blanc sur les graphiques pour des raisons de responsive */
    fill: transparent;
}

/* ================================ Mots-clés (Widget) ================================ */

/* Marge interne du widget Mots clés ------------------------------------------------------------------------------ */
.widget-cloud { 
    padding: 20px;
}

/* Style des mots clés du widget Mots clés ------------------------------------------------------------------------------ */
.widget-cloud .keyword { 
    background-color: var(--bouton);
    color: #fff;
    padding: 4px 12px;
    font-size: 16px;
    border-radius: 0px 7px 0px 7px;
    display: inline-block;
    margin-top: 5px;
    padding-bottom : 0px;
    transition: var(--transition);
}

/* Fond du mots clés widget Mots clés Hover (au passage du curseur) -------------------------------------- */
.widget-cloud .keyword:hover { 
    background-color: var(--hover);
}

/* Widget Actu Liens cliquable ) -------------------------------------- */
.widget-feeds .link span, .widget-feeds .link .btn-link span[class^="icon-"] {
color: var(--texte-url);
}

/*=================================================================================*/
/*========================= CONTENUS MODIFIABLE (Mode avancé) =====================*/
/*================================================================================*/

/* ============================ TAG ============================ */

/* Disposition des tags et bouton Collections/Mots Clés/Exporter dans un page de recap des notice --------------------------------------------- */
.hal-bgtext, a.hal-bgtext {
line-height: 2.5rem!important;
display: inline-block!important;
padding: 0px 12px;
margin-top: 5px;
}


/* ============================ Bouton ============================ */

/* Bouton +Déposer aux couleurs de l'Inria --------------------------------------------- */
.btn-primary-orange { 
    background: var(--bouton);
    border: 1px solid var(--bouton);
}

/* Bouton +Déposer aux couleurs de l'Inria --------------------------------------------- */
.btn-primary-orange:hover { 
    background-color: var(--hover);
}

/* ============================ Zone & Barre de Recherche ============================ */

/* Correction d'un décalage de la barre de recherche à droite --------------------------------------------- */
#searchHeaderList { 
    margin: auto !important;
}

/* Correction d'un bug permettant un défilement vertical non nécessaire --------------------------------------------- */
#ssheader-submit {  
    margin-left: 0!important;
    margin-right: 0;
}

/* Correction d'un bug de positionnement de la loupe dans la barre de recherche et mise en couleur (harmonisation) --------------------------------------------- */
.hal-main-search-button { 
    padding: 0 10px;
    color: var(--widget);
}

/* Mise en couleur de la ligne au clic dans la zone de recherche (harmonisation) (harmonisation) --------------------------------------------- */
.hal-main-search-input { 
    background-image: linear-gradient(0deg,var(--bouton-menu) 50%,#0000 0);
    color: var(--texte);
    border-radius:25px;
}

/* Plus grande taille du menu déroulant dans la zone de recherche avancée --------------------------------------------- */
.dropdown-menu.show { 
    max-height: 485px !important;
}

/* Correction de la hauteur des zones de 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;
}

/* Correction de la taille des boutons dans recherche avancée  ----------------------------------------------------------------------------------------------------------------------------------------- */
.input-group span.input-group-btn { 
    width: 87px;
}

/* Correction de la marge des boutons dans recherche avancée ----------------------------------------------------------------------------------------------------------------------------------------- */
div.form-group.row .btn-group-sm > .btn-primary.btn, div.form-group.row .btn-primary.btn-sm {
    margin: auto;
}

/* Correction d'un bug sur le Hover (au passage de la souris) des boutons dans recherche avancée ---------------------------------------------------------------------------------------------------- */
.input-group span.input-group-btn button:hover { 
    background-color: transparent; 
}

 /* Harmonisation des couleurs sur le active des boutons dans recherche avancée --------------------------------------------------------------------------------------------------------------------- */
.btn-primary:not(:disabled):not(.disabled).active, .btn-primary:not(:disabled):not(.disabled):active, .show > .btn-primary.dropdown-toggle {
    background-color: var(--hover);
    border-color: var(--hover);
}

/* Uniformisation des couleurs et animations des boutons dans recherche avancée   ------------------------------------------------------------------------------------------------------------------------- */
div.form-group.row span.input-group-btn { 
    background-color: var(--bouton);
    transition: var(--transition)
}

/* Couleur du Bouton Ajouter dans zone de recherche hover (au passage de la souris) ---------------------------------------------------------------------------------------------------------- */
div.form-group.row span.input-group-btn:hover { 
    background-color: var(--hover);
}

/* Couleur du Bouton Lancer la recherche dans zone de recherche avancée ---------------------------------------------------------------------------------------------------------- */
.hal-visualize-button { 
    background-color: var(--bouton);
}

/* Couleur du Bouton Lancer la recherche dans zone de recherche hover (au passage de la souris) ---------------------------------------------------------------------------------------------------------- */
.hal-visualize-button:hover {
    background-color: var(--hover);
}
/* Texte Noir en Hover (au passage de la souris) sur les menus déroulant ---------------------------------------------------------------------------------------------------------- */
ul.dropdown-menu li:not(.not-white):hover a {
    color: #000 !important;
}
/* Meilleurs Ombrage de la barre du CCSD ---------------------------------------------------------------------------------------------------------- */
.sub-header {
    box-shadow: 0 4px 3px #00000029;
}

/* Ajouts d'effet de Transition dans sur les zone dans la page Resultat  ---------------------------------------------------------------------------------------------------------- */
.table-white tr {
    transition: var(--transition);
}

/* ======================================================================================= */
/* ====================================== MENU ========================================== */
/* ===================================================================================== */

/* ============================ Zone du menu ============================ */

/* Style de la zone du menu principal ----------------------------------------------------------------------- */
.website-navigation {
    background: var(--menu);
    min-height: 50px;
    padding-bottom: 0px;
    padding-top: 0px;
    box-shadow: 0 12px 24px 0 rgba(56, 66, 87, 0.31);
}

/* Taille des éléments du menu principal ----------------------------------------------------------------------- */
.nav-pills .nav-link { 
    border-radius: 0px;
    padding-top: 10px !important;
}

/* Couleur des boutons du menu principal ----------------------------------------------------------------------- */
.nav-pills .nav-link.active, .nav-pills .show > .nav-link{
    background-color: var(--bouton-menu);
    color: #fff;
}

/* Couleur des boutons du menu principal en Hover (au passage de la souris) ----------------------------------------------------------------------- */
.website-navigation .nav-pills .nav-link:hover, .website-navigation .nav-pills .show > .nav-link { 
    background: var(--hover-menu);
    color:#fff
}

{ /* Transition (survol du curseur) sur le menu --------------------------------------------------------------------------------------- */
.website-navigation .nav-pills .nav-link 
    transition: var(--transition);
}

/* ============================ Menu déroulant (principal) ============================ */

/* Effet de Transition des menu  --------------------------------------------------------------------------------------- */
.list-group-item {
transition: var(--transition);
}

/* Style du menu déroulant (principal)  --------------------------------------------------------------------------------------- */
.website-navigation .nav-pills .dropdown-menu {
    background: var( --hover-menu2);
    border: 0px;
    border-radius:0px;
    margin: 0px -41px;
    padding: 0px 0px;
}
/* Style du sous-menu déroulant (principal)  --------------------------------------------------------------------------------------- */
.website-navigation .dropdown-menu .dropdown-submenu > .dropdown-menu {
margin-top: 0px;
}
/* Couleur du texte dans le menu déroulant (principal) & transition ----------------------------------------------------------------------- */
.website-navigation .dropdown-menu a { 
    color: #fff;
}

/* Couleur dans le menu déroulant (principal) hover  (au passage de la souris) ----------------------------------------------------------------------- */
.website-navigation .dropdown-menu li.nav-item:hover a { 
    color: #fff!important;
}

/* Couleur du fond dans le menu déroulant (principal) hover  (au passage de la souris) ----------------------------------------------------------------------- */
.dropdown-item:focus, .dropdown-item:hover {
    background-color: var(--hover-menu);
    color: #fff;
}

/* Correction bug du couleur sur les boutons du menu déroulant (principal) hover (au passage de la souris)   -------------------------------------------------------- */
ul.dropdown-menu li:not(.not-white):hover {
background-color: var(--hover-menu) !important;
}


/*==================================================================================*/
/*===================================== GENERALE =====================================*/
/*=================================================================================*/

/* Hauteur du la page par rapport au menu principal ----------------------------------------------------------------------- */
main {
    padding-top: 4rem;
}

/* Correction d'un effet survol inutile dans le menu administrer dans HAL de la barre du CSSD -------------------------------------------------- */
.btn-icon:hover {
    background-color: unset !important;
}

/* Ajout d'un Display inline-block au label pour évité 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;
}

/*=====================================================================================*/
/*===================================== PAGE DEPOT =====================================*/
/*====================================================================================*/

/* Style sur le sous menus dans Fichier / Métadonnées / Validation ----------------------------------------------------------------------- */
#list-item-deposit li.child-item {
    margin-top: 15px;
    transition: var(--transition);
    font-family: noto sans;
}
/* Transition sur  Fichier / Métadonnées / Validation ----------------------------------------------------------------------- */
#list-item-deposit li.main-item:not(first-child) {
    transition: var(--transition);
}
/* Couleur du texte au passage de la souris sur et dans  Fichier / Métadonnées / Validation ----------------------------------------------------------------------- */
#list-item-deposit li:hover a {
color: #fff;
}

/* Background sur les btns à gauche Fichier / Métadonnées / Validation ----------------------------------------------------------------------- */
#list-item-deposit li:hover {
    background-color: var(--hover-menu);
}

/*Effet de transition sur les boutons de la page Dépôt "Je selectionne un type de document " ----------------------------------------------------------------------- */
#modal-typdoc .modal-dialog .typdoc-btn-group {
    transition: var(--transition);
}
/*Effet de transition sur le boutton Récup Métadonnées ----------------------------------------------------------------------- */
.hal-option-button, .hal-privilege-button {
    transition: var(--transition);
}
/*Effet de transition sur les btn exporter dans page vérification ----------------------------------------------------------------------- */
.hal-bgtext, a.hal-bgtext {
    transition: var(--transition);
}

/*Effet de transition sur les btns des block des pages Ressource et En-Tête  ----------------------------------------------------------------------- */
.table-hover tbody tr {
    transition:var(--transition);
}   
.edit-navigation .ui-sortable li > div, #list_typdoc li > table {
    transition:var(--transition);
}

/*==================================================================================*/
/*===================================== FOOTER =====================================*/
/*=================================================================================*/

/* Style et couleur du footer ----------------------------------------------------------------------- */
footer { 
    background-color: #272F3D !important;
    margin-top: 0px;
    padding-top: 50px;
}

/* Style et couleur du texte du footer ----------------------------------------------------------------------- */
footer li a { 
    color: #fff;
    background-image: linear-gradient(currentColor, currentColor);
    background-position: 0% 100%;
    background-repeat: no-repeat;
    background-size: 0% 1px;
    transition: background-size 0.3s;
}

/* Style et couleur du texte du footer hover ----------------------------------------------------------------------- */
footer li a:focus, footer li a:hover { 
    color: #fff;
    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;
}
/* Séparateur du footer entre les élements  ----------------------------------------------------------------------- */
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;
}

/*==================================================================================*/
/*==================================== RESPONSIVE ==================================*/
/*==================================================================================*/

/* Correction du chevauchement du bouton [+déposer dans HAL] avec la barre de rechercher ----------------------------------------------------------------------- */
@media (min-width: 992px) and (max-width: 1200px) { 
#searchHeaderList {
    width: 50%!important;
}
}

@media (max-width: 1280px) { 
.logo {
background-image: url('../public/ban_blanc_1280.png');
}
.text-ban {
font-size: 18px;
}
}

@media (min-width: 1281px) and (max-width: 1920px) { 
.logo {
background-image: url('../public/ban_blanc_1280_1920.png');
}
}

@media (min-width: 1921px) and (max-width: 2560px) { 
.logo {
background-image: url('../public/ban_blanc_2560.png');
}
}

@media (min-width: 0px) and (max-width: 450px) { 
.text-ban {
font-size: 14px;
}
}