/*
 *
 * FORMATS DE PLAGES
 *
 */

body {
	margin: 0; padding: 0;
	--primary-alt: #4D5FB8;
}


/* TRICKS POUR LES BOUTONS PRIMARY, LIENS BARRE BLEUE ET NAV */
/* body.dist-page-prive .nav-link.active,
body.dist-page-prive .bg-primary {
	background-color: var(--primary-alt) !important;
}
body.dist-page-prive button.nav-link, 
body.dist-page-prive .nav-pills a.nav-link {
	color: var(--primary-alt) !important;
}
body.dist-page-prive #aktone-page-tete nav.bg-primary .nav-link,
body.dist-page-prive a.nav-link.active {
	color: #FFF !important;
}
 */
:root {
  /* Couleur principale */
  --bs-primary: #4D5FB8; /* Nouvelle couleur primaire */
  --bs-primary-rgb: 77,95,184;

  /* Couleurs dérivées (hover, borders, etc.) */
  --bs-primary-bg-subtle: #e3f2fd;
  --bs-primary-border-subtle: #bbdefb;
  --bs-primary-text-emphasis: #4D5FB8;

  --bs-nav-pills-link-active-bg: #4D5FB8;

}

a { text-decoration: none !important; }
/*
 * PAGE FULL
 *
 * Page monobloc
 *
 */
body.dist-page-full h1 { margin-top: 0px; }
body.dist-page-full .panel { padding:0; margin: 0px; }
body.dist-page-full .jumbotron { margin: 0px; }
body.dist-page-full .panel-body { padding:0; margin: 0px; }
body.dist-page-full .form-group .btn-group {
	padding: 10px 0px;
}
/*
 * PAGE MONO
 *
 * Page monobloc
 *
 */
body.dist-page-mono h1 { margin-top: 0px; }
body.dist-page-mono .panel { padding:0; margin: 0px; }
body.dist-page-mono .jumbotron { margin: 0px; }
body.dist-page-mono .panel-body { padding:0; margin: 0px; }
body.dist-page-mono .form-group .btn-group {
	padding: 10px 0px;
}
/******************************************************************************/
/*
/* ! STRUCTURE VERTICALE */
/*
/******************************************************************************/
#aktone-page-extra {
	height: 0px;
}
#aktone-page-extra>.modal-dialog {
	visibility: hidden;
	position: fixed;
	left: -100vw;
	top: -100vh;
}
#aktone-page-conteneur {
	position: relative;
	min-height: 100vh;
	width: 100vw;
	margin: 0;
	padding: 0;
}
#aktone-page-aide {
	background:#FFF;
	border: 2px solid #000;
	color: #000;
	top: 50px;
	right: 50px;
	position: fixed;
	width: 20vw; 
	z-index: 100000
}
#aktone-page-tete,
#aktone-page-inter,
#aktone-page-corps,
#aktone-page-pied  {
	height: auto;
	padding: 0;
}
#aktone-page-tete,
#aktone-page-exter,
#aktone-page-pied  {
	width: 100vw;
	margin: 0;
}
#aktone-page-pied {
	text-align: center;
	font-size: 0.9em;
}
#aktone-page-exter {
	position: fixed;
	bottom: 0;
	max-height: 10vh;
	height: 10vh;
}
body.ak-page-exter #aktone-page-conteneur {
	padding-bottom: 10vh;
}
#aktone-page-exter-bc {
	background-color: #FFF;
	opacity: 0.8;
	width: 100%;
	height: 100%;
	position: absolute;
}
/* dimensionnés obligatoirement par l'usage d'un col-dim */
#aktone-page-principal,
#aktone-page-lateral {
	position: relative;
	padding: 0;
	margin: 0;
}
/* CONTENEUR POUR LE PLEIN ECRAN */
#aktone-page-full {
	width: 100vw;
	height: 100vh;
	position: absolute;
	background: #FFF;
	top: 0;
	left: -100vw;
	z-index: var(--zindex-over);
}

/* ! STRUCTURE HORIZONTALE */
#aktone-page-conteneur-nav {
	position: fixed;
	margin: 0;
	padding: 0;
	width: 20vw;
	min-width: 200px;
	max-width: 20vw;
	height: 100vh;
	min-height: 100vh;
}
#aktone-page-conteneur-div {
	position: absolute;
	min-height: 100vh;
	left: 20vw;
	width: 80vw;
	max-width: 80vw;
	margin: 0;
	padding: 0;
	overflow-x:hidden;
}
.card { background-color: transparent !important; }
/******************************************************************************/
/*
/* ! STRUCTURE DES BLOCS */
/*
/******************************************************************************/

/**
 * les corediv sont intégrés automatiquement dans un col,
 * mais pas directement, donc :
 * - ils ne doivent pas avoir de margin
 * - ils doivent se comporter comme des cols (notamment en flex ?)
 *
 */
.page-header,
.jumbotron,     /* AFFICHES */
.panel,         /* PANNEAUX */
.table-responsive,
.table,
.form,
.panel-heading,
.panel-body,
.multipan,      /* MULTIPANS */
.nav-tabs {
	position: relative;
	width: 100%;
	height: auto;
	margin: 0;
	margin-top: 0;
	margin-bottom: 0;
}

#gvBlocControle {
	max-height:100vh;
}
/* 
,
.multipan-tiroir,
.multipan-contenu
#aktone-page-lateral {

max-height: 100%;
} */



/*******************************************************\
 * BLOCS AKTONE (VERTICAL)
\*******************************************************/
#aktone-page-conteneur, 				/* le conteneur est un bloc */
#aktone-page-full,
#aktone-page-conteneur-nav,
#aktone-page-conteneur-div,
.aktone-bloc,
.aktone-div-dim {
	display: flex;
	flex-flow: column wrap; 			/* column : va positionner sur y, wrap : va fitter et passera sur x au bout */
	justify-content: space-between;		/* alignement sur l'axe choisi */
	align-items: stretch;				/* alignement sur l'autre axe */
	align-content: stretch;				/* alignement sur l'autre axe (en tant que lignes) */
}
body.ak-page-verticale.ak-page-noflux #aktone-page-conteneur {
	height: 100vh; 
	max-height: 100vh;
} 
body.ak-page-verticale #aktone-page-conteneur {
	width: 100vw; 
	max-width: 100vw;
} 
.aktone-bloc {
	min-width: 1px;
	max-width: 100%; 					/* important pour les medias inclus */
}
/* pour simuler les padding de n'importe quel bloc bootstrap */
.aktone-box {
	/* padding: var(--bs-btn-padding-x) var(--bs-btn-padding-y); */
	padding-top: 6px;
	padding-bottom: 6px;
}
/*******************************************************\
 * STRUCTURE INTRA-BLOC (HORIZONTAL)
\*******************************************************/

/* row pour fonctionner avec https://cooplage.test.accatone.net/prive/user/ */
#aktone-page-corps,
.aktone-bloc-corps {
	display: flex;
	flex-flow: row wrap; 				/* row : va positionner sur x, wrap : va fitter et passera sur y au bout */
	justify-content: flex-start;		/* répartition sur l'axe principal */
	align-items: stretch;				/* alignement sur l'autre axe */
	align-content: stretch;				/* alignement sur l'autre axe (en tant que lignes) */
}
#aktone-page-inter,
#aktone-page-tete,
#aktone-page-corps  {
	min-width: 1px;
	max-height: 100%;
}
#aktone-page-pied,
.aktone-bloc-tete,
.aktone-bloc-corps,
.aktone-bloc-pied  {
	width: 100%;
	min-width: 1px;
	max-height: 100%;
}
#aktone-page-corps,
.aktone-bloc-corps,
#aktone-page-conteneur-nav #aktone-page-tete {
	flex-grow: 4;
	flex-shrink: 4;
	flex-basis: auto;
}
#aktone-page-tete,
#aktone-page-pied,
.aktone-bloc-tete,
.aktone-bloc-pied {
	flex-grow: 0;
	flex-shrink: 4;
	flex-basis: content;
	max-width: 100%;
}


/* corrections manuelle @todo : à vérifier */
.aktone-bloc.aktone-flex .aktone-bloc-corps>div {
	flex-grow: 4;
	flex-shrink: 4;
	flex-basis: auto;
} 

/*******************************************************\
 * STRUCTURE INTRA-CORPS (VERTICAL)
\*******************************************************/
#aktone-page-lateral,
#aktone-page-principal {
	display: flex;
	flex-flow: row wrap; 			/* row : va positionner sur x, wrap : va fitter et passera sur y au bout */
	justify-content: flex-start;		/* répartition sur l'axe principal */
	align-items: stretch;				/* alignement sur l'autre axe */
	align-content: stretch;				/* alignement sur l'autre axe (en tant que lignes) */
}
#aktone-page-lateral,
#aktone-page-principal,
.aktone-bloc-composant {
	flex-grow: 4;
	flex-shrink: 4;
	flex-basis: auto;
	min-height: 1px;
	max-width: 100%;
	/* height: 100%; */ /* ne pas réactiver, çà bloque les cartos */
}

/* Enfants à dimension min */
.aktone-div-nul,
.aktone-div-dim {
	position :relative;
	flex-grow: 0;
	flex-shrink: 0;
	flex-basis: auto;
}
/* Enfants à dimension max */
.aktone-bloc>.aktone-bloc-composant,
.tab-content > .active {
	flex-grow: 4;
	flex-shrink: 4;
	flex-basis: auto;
	max-height: 100%;
}
/* .aktone-bloc-composant { width: 100%; } */
.aktone-bloc.aktone-noflex>.aktone-bloc-composant,
.aktone-bloc.aktone-noflex .aktone-bloc-corps,
.aktone-bloc.aktone-noflex .tab-content > .active {
	flex-grow: 0;
}

/******************************************************************************/
/*
/* ! PAGE FLUX / NOFLUX */
/*
/******************************************************************************/
body.ak-page-noflux {
	height: 100vh;
	width: 100vw;
	overflow:hidden;
}
body.ak-page-horizontale.ak-page-flux {
	height: 100%;
	width: auto;
	overflow-x:scroll;
	overflow-y:hidden;
}

/* le bloc corps doit être rogné, avec une navbar */
body.ak-page-noflux .aktone-bloc-corps {
	overflow: hidden;
	overflow-y: auto;
	min-height: 1px; /* important ! */
	/* height: 100%; /* important ! pour les svg inclus ?*/ */
}
/* le bloc corps doit être rogné */
body.ak-page-flux .aktone-bloc-corps {
	overflow: clip visible; /* problème avec les dropdowns quand on active le scroll */
	/* max-width: 100%; */
	/* overflow-x: auto;  */
}
body.ak-page-flux .aktone-flux .aktone-bloc-corps {
	overflow-x: auto;
}
body.ak-page-verticale.ak-page-flux {
	height: auto;
	width: 100%;
	overflow-x:hidden;
	overflow-y:auto;
}
body.ak-page-noflux #aktone-page-pied {
	min-height: 2em;
	height: 2em;
	line-height: 2em;
	background: rgba(255,255,255,0.2);
	z-index: var(--zindex-nav);
}
/* SURVOL DE LA BARRE */
body.ak-page-survol #aktone-page-tete nav {
	transform: translateY(-300%);
}
body.ak-page-survol #aktone-page-tete:hover nav {
	transform: translateY(0);
}
body.ak-page-survol #aktone-page-tete {
	position: absolute;
	z-index: var(--zindex-nav);
}
/******************************************************************************/
/*
/* ! PAGE CONTENEUR / NOCONTENEUR */
/*
/******************************************************************************/

/* VARIANTES SANS CONTENEUR */
body.ak-page-noconteneur #aktone-page-tete .container-fluid,
body.ak-page-noconteneur #aktone-page-tete-conteneur .container-fluid {
	padding-left: 0;
	padding-right: 0;
}
body.ak-page-noconteneur #aktone-page-tete,
body.ak-page-noconteneur #aktone-page-tete-conteneur  {
	padding-left: 0;
	padding-right: 0;
	padding-bottom: 0;
}
body.ak-page-noconteneur #aktone-page-inter>.aktone-bloc,
body.ak-page-noconteneur #aktone-page-principal>.aktone-bloc,
body.ak-page-noconteneur #aktone-page-lateral>.aktone-bloc,
body.ak-page-noconteneur #aktone-page-pied>.aktone-bloc,
body.ak-page-noconteneur #aktone-page-inter>.row>.aktone-bloc,
body.ak-page-noconteneur #aktone-page-lateral>.row>.aktone-bloc,
body.ak-page-noconteneur #aktone-page-principal>.row>.aktone-bloc,
body.ak-page-noconteneur #aktone-page-pied>.row>.aktone-bloc {
	padding-top: 0;
	padding-left: 0;
	padding-bottom: 0;
	padding-right: 0;
}
body.ak-page-noconteneur #aktone-page-inter,
body.ak-page-noconteneur #aktone-page-inter .aktone-bloc {
	padding-top: 0;
}

/*
** VARIANTES AVEC CONTENEUR
**
*/

/* PADDING-TOP ET BOTTOM */
body.ak-page-conteneur #aktone-page-tete,
body.ak-page-conteneur #aktone-page-inter {
	margin-bottom: var(--ecart-unite);
}

body.ak-page-conteneur #aktone-page-pied {
	margin-top: var(--ecart-unite);
}
/* SPECIAL BOOTSTRAP */
body.ak-page-conteneur #aktone-page-tete .container-fluid {
	/* padding-left: var(--ecart-unite);
	padding-right: var(--ecart-unite); */
	padding-left: 0;
	padding-right: 0;
}

/******************************************************************************/
/*
/* ! BLOC PAD/NOPAD */
/*
/******************************************************************************/
.aktone-bloc,
.aktone-div-dim {
	padding-left: var(--ecart-unite);
	padding-right: var(--ecart-unite);
	padding-bottom: var(--ecart-unite);
	padding-top: var(--ecart-unite);
}

.panel>.panel-body {
	padding: var(--ecart-unite);
}
.multipan-vertical .multipan-nav {
	padding: var(--ecart-unite) 0;
}

.table>thead>tr>th,
.table>tbody>tr>th,
.table>tfoot>tr>th,
.table>thead>tr>td,
.table>tbody>tr>td,
.table>tfoot>tr>td {
	padding: var(--ecart-unite-demi);
}


/* GESTION DU PADDING DES BLOCS PAR SURCHARGE DES ELEMENTS BOOTSTRAP */
.aktone-bloc.aktone-noconteneur {
	padding:0;
}
/* CONTENEUR VERTICAL (on annule le padding horizontal) */
.aktone-bloc.aktone-cnt-v  {
	padding-left: 0 !important;
	padding-right: 0 !important;
}
/* CONTENEUR HORIZONTAL (on annule le padding vertical) */
.aktone-bloc.aktone-cnt-h  {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}


/* GESTION DU PADDING DES COMPOSANTS PAR SURCHARGE DES ELEMENTS BOOTSTRAP */
.aktone-nopad>.card>.card-title,
.aktone-nopad>.card>.card-body,
.aktone-nopad>.multipan>.multipan-contenu,
.aktone-nopad>.multipan>.multipan-nav,
.aktone-nopad>.aktone-bloc-composant>.table>thead>tr>th,
.aktone-nopad>.aktone-bloc-composant>.table>tbody>tr>th,
.aktone-nopad>.aktone-bloc-composant>.table>tfoot>tr>th,
.aktone-nopad>.aktone-bloc-composant>.table>thead>tr>td,
.aktone-nopad>.aktone-bloc-composant>.table>tbody>tr>td,
.aktone-nopad>.aktone-bloc-composant>.table>tfoot>tr>td {
	padding: 0;
}

/* PAD VERTICAL (on annule le padding horizontal) */
.aktone-pad-v>.card>.card-body,/* @bs5 */
.aktone-pad-v>.card>.card-title,/* @bs5 */
.aktone-pad-v>.multipan>.multipan-contenu,
.aktone-pad-v>.card>.aktone-bloc-corps /* @bs5 */ {
	padding-left: 0 !important;
	padding-right: 0 !important;
}
/* PAD HORIZONTAL (on annule le padding vertical) */
.aktone-pad-h>.card>.card-body, /* @bs5 */
.aktone-pad-h>.card>.card-title, /* @bs5 */
.aktone-pad-h>.multipan>.multipan-contenu,
.aktone-pad-h>.card>.aktone-bloc-corps  /* @bs5 */ {
	padding-top: 0 !important;
	padding-bottom: 0 !important;
}




/* Les rows au premier niveau */
#aktone-page-principal>.row,
#aktone-page-lateral>.row,
#aktone-page-inter>.row,
.tab-pane>.row {
	width: 100%;
	/* margin: 0; */
}
/* #aktone-page-principal>.row>.aktone-bloc, */
#aktone-page-lateral>.row>.aktone-bloc,
#aktone-page-inter>.row>.aktone-bloc {
	padding: 0;
}

/* tricks : certains trucs doivent être corrigés manuellement
 * il faut les intégrer dans aktone
 */
#aktone-page-inter .page-header {
	padding-bottom: 0;
}
#aktone-page-inter .page-header h2 {
	padding-bottom: 0;
}

/* BLOCS AD HOC */
/* dans les multipans, le tab-content n'est pas le vrai conteneur */
.tab-pane {
	padding:0; margin:0;
}

/******************************************************************************/
/*
/* ! BLOC BORDURE / NOBORDURE */
/*
/******************************************************************************/
.panel-heading,
.panel-body,
.panel-body-inside,
.panel-footer,
.panel-body .jumbotron,
.panel-body-inside .jumbotron,
.multipan {
	border-color: transparent;
}
.aktone-bordure>.multipan {
	border: 1px solid var(--coul-filet);
	overflow:hidden;
}
.aktone-bordure>.card>.panel-heading,
.aktone-bordure>.multipan-horizontal>.multipan-nav,
.aktone-bordure>.multipan>.multipan-tete {
	border-bottom: 1px solid var(--coul-filet);
}
.aktone-bordure>.multipan-vertical>.multipan-nav {
	border-right: 1px solid var(--coul-filet);
}
.aktone-bordure>.multipan>.multipan-pied {
	border-top: 1px solid var(--coul-filet);
}
.aktone-nobordure>.panel-default,
.aktone-nobordure>.card,
.aktone-nobordure>.multipan {
	border: 0px solid var(--coul-filet);
}
.panel-default,
.multipan {
	border-radius: 12px;
}
.aktone-no-radius>.panel-default,
.aktone-no-radius>.multipan {
	border-radius: 0px;
}

/******************************************************************************/
/*
/* ! BLOC OPAQUE / TRANSPARENT */
/*
/******************************************************************************/

/* REGLAGES DE BASE TRANSPARENCE */
.aktone-opaque>.bs_row>.panel-default,
.aktone-opaque>.bs_row>.panel,
.aktone-opaque>.bs_row>.multipan {
	/* background-color: var(--front); */
}
.aktone-transparent>.bs_row>.panel-default,
.aktone-transparent>.bs_row>.panel,
.aktone-transparent>.bs_row>.multipan {
	background-color: transparent;
}
/* CERTAINS BLOCS ET COMPOSANTS SONT TRANSPARENTS PAR NATURE */
table,
.tab-pane,
.panel-footer {
	background-color: transparent !important;
}
/* .aktone-bloc, */
.aktone-bloc-tete {
	background-color: transparent !important;
}
#aktone-page-tete .aktone-bloc,
#aktone-page-inter .aktone-bloc,
.aktone-bloc.aktone-transparent,
.aktone-bloc.aktone-transparent tab-pane {
	background-color: transparent;
}
.ak-frm-action {
	padding-top: var(--ecart-double);
}

.aktone-opaque .multipan-contenu {
	/* background: #000; */
}
.aktone-transparent .multipan-contenu {
	background: transparent;
}
/* ! -- multipan */


.multipan-vertical .multipan-nav ul {
	padding: var(--ecart-unite);
}
.multipan-horizontal>.multipan-nav ul {
	padding: var(--ecart-unite-demi) var(--ecart-unite);
}
.multipan-contenu,
.multipan-nav {
	float:left;
}
.multipan-tete,
.multipan-pied,
.multipan-nav ul.nav,
.multipan-vertical>.multipan-nav>ul.nav,
.multipan-vertical>.multipan-nav>ul.nav>li {
	width: 100%
}


/******************************************************************************\
 *
// ! STYLES DE BLOC
 *
\******************************************************************************/
.aktone-div-nul {
	padding: 0 !important;
}
.aktone-bloc-tete>h1,
.aktone-bloc-tete>h2,
.aktone-bloc-tete>h3,
.aktone-bloc-tete>h4,
.panel-heading.aktone-bloc-tete h4,
.panel-heading.aktone-bloc-tete h5 {
	padding:0; margin:0;
}




.thumbnail,
.panel-default {
	border-radius: 1.2rem;
}
.thumbnail>img {
	border-radius: 1.2rem 1.2rem 0 0;
}
.thumbnail:hover {
	/* box-shadow: -19px -14px 10px 0px #000; */
	border-color: var(--primary-base);
}
.thumbnail,
.panel-default,
.panel,
.multipan {
	/* background-color: var(--front); */
	box-shadow: 0 0 #0000, 0 0 #0000, 0 0.2rem 0.4rem rgba(0, 0, 0, 0.05);
	/* -webkit-transition: 0.5s ease-in-out;
	transition: 0.5s ease-in-out; */
}
.aktone-no-ombre>.bs_row>.thumbnail,
.aktone-no-ombre>.bs_row>.panel-default,
.aktone-no-ombre>.bs_row>.panel {
	box-shadow: none;
}
/******************************************************************************\
 *
// ! NAVBAR
 *
\******************************************************************************/
#aktone-page-tete .navbar {
	z-index: var(--zindex-nav);
	text-align: center;
	min-height: auto;
	width: 100%;
}
#aktone-page-tete nav i.fas:after {
	content: '\00a0 ';
}
#aktone-page-tete nav i.fas {
	/* height:21px;
	line-height:21px; */
}
#aktone-page-tete .navbar a,
.navbar li {
	text-align: left;
}
#aktone-page-tete nav {
	position: relative;
	z-index: var(--zindex-nav);
	width: 100%;
}
#aktone-page-tete nav.navbar-app {
	z-index: var(--zindex-nav-sub);
}
#aktone-page-tete nav li a  {
	padding-top: 7px;
	padding-bottom: 7px;
}

#aktone-page-tete .navbar i.fas {
	padding-right:0.3em;
	width: 22px;
	text-align: center;
}
#aktone-page-tete .navbar i.fas.pull-right {
	padding-right:0;
	padding-left:0.3em;
}
.dropdown-menu {
	/* scrollbar-color: transparent darkgray; */
	scrollbar-width: 5px;
	overflow-y: auto;
	max-height: 40vh;
}

/* width */
.dropdown-menu::-webkit-scrollbar {
	width: 5px;
}

/* Track */
.dropdown-menu::-webkit-scrollbar-track {
	background: transparent;
}

/* Handle */
.dropdown-menu::-webkit-scrollbar-thumb {
	background: darkgray;
}

/* Handle on hover */
.dropdown-menu::-webkit-scrollbar-thumb:hover {
	background: darkgray;
}


/******************************************************************************\
 *
// ! TIROIRS
 *
\******************************************************************************/
.aktone-tiroir {
	position: fixed;
	height: 80vh;
	top: 10vh;
	z-index: var(--zindex-over);
	background: #FFF;
	width: 33.3333vw;
	min-width: 600px;
	max-width: 100vw;
	padding:0;
	margin:0;
	overflow: hidden;
	border: 1px solid var(--coul-filet);
	/* background-color: var(--coul-filet); */
}
.aktone-tiroir .close {
	position: absolute;
	top: var(--ecart-unite);
	right: var(--ecart-unite);
	z-index: 10000;
}
.aktone-tiroir-conteneur {
	height: 80vh;
	width: 100%;
}
.aktone-tiroir-conteneur>.aktone-bloc {
	height: 80vh;
	width: 100%;
	padding:0; margin:0;
}
.aktone-tiroir-conteneur>.aktone-bloc>.aktone-bloc-tete {
	padding: var(--ecart-unite);
	width: 100%;
	border-bottom: 1px solid var(--coul-filet);
	/* background: #EEE; */
}
.aktone-tiroir-conteneur>.aktone-bloc>.aktone-bloc-corps {
	overflow: hidden;
	overflow-y: auto;
	height: 1px; /* important ! */
}
.aktone-tiroir-conteneur>.aktone-bloc.aktone-defilable {
	overflow-x: hidden;
	overflow-y: auto;
	height: 100%;
}
.aktone-tiroir-conteneur>.aktone-bloc>.aktone-bloc-pied {
	padding: var(--ecart-unite);
	width: 100%;
	border-top: 1px solid var(--coul-filet);
	/* background: #EEE; */
}
.aktone-tiroir-conteneur iframe { border:none; }

#aktone-tiroir-droite {
	border-left: 1px solid #ddd;
	-webkit-box-shadow: -3px 0px 5px 0px rgba(221,221,221,.50);
	-moz-box-shadow: -3px 0px 5px 0px rgba(221,221,221,.50);
	box-shadow: -3px 0px 5px 0px rgba(221,221,221,.50);
	border-top-left-radius: var(--ecart-unite);
	border-bottom-left-radius: var(--ecart-unite);
	right: -100vw;
	opacity: 0.8;
	transition: right 0.5s ease-in;
}
#aktone-tiroir-droite.ouvert {
	right: 0;
	opacity: 1;
}
#aktone-tiroir-gauche {
	border-right: 1px solid #ddd;
	-webkit-box-shadow: 5px 0px -3px 0px rgba(221,221,221,.50);
	-moz-box-shadow: 5px 0px -3px 0px rgba(221,221,221,.50);
	box-shadow: 5px 0px -3px 0px rgba(221,221,221,.50);
	border-top-right-radius: var(--ecart-unite);
	border-bottom-right-radius: var(--ecart-unite);
	left: -100vw;
	opacity: 0.8;
	transition: left 0.5s ease-in;
}
#aktone-tiroir-gauche.ouvert {
	left: 0;
	opacity: 1;
}
#aktone-tiroir-droite-btn i,
#aktone-tiroir-gauche-btn i,
#corePageRetourBtn i,
#corePageArriereBtn i,
#corePageAvantBtn i,
#corePageHomeBtn i,
.corePageBtn i {
	color: #fff;
	/* box-shadow: 0px 0px 0px 5px var(--primary-base); */
	box-shadow: 0px 0px 0px 1px #fff;
	background: var(--primary-base);
	/* border: dashed 1px #FFF; */
	border: solid 1px #fff;
	text-align: center;
	margin: 0; padding:0;
	border-radius: 50%;
	width: 2em;
	height: 2em;
	font-size: 1.2em;
	line-height: 1.8em;
	-webkit-transform: scale(1);
	transform: scale(1);
	-webkit-transition: .3s ease-in-out;
	transition: .3s ease-in-out;
}
/* 'bg-success','plus'=>'bg-info','moins'=>'bg-warning','ko'=>'bg-danger' */
.couleur_normal { background: var(--primary-base); }
.couleur_moins { background: var(--warning-base)!important; }
.couleur_plus { background: var(--info-base)!important; }
.couleur_ko { background: var(--danger-base)!important; }
.couleur_ok { background: var(--success-base)!important; }
.couleur_defaut { background: var(--default-base)!important; }

.corePageBtnAdmin i {
	background: var(--danger-base);
}
#aktone-tiroir-droite-btn {
	position: fixed;
	bottom: var(--ecart-unite);
	right: var(--ecart-unite);
	z-index: var(--zindex-nav);
}
#aktone-tiroir-gauche-btn {
	position: fixed;
	bottom: var(--ecart-unite);
	left: var(--ecart-unite);
	z-index: var(--zindex-nav);
}
#corePageRetourBtn {
	position: fixed;
	top: var(--ecart-unite);
	left: var(--ecart-unite);
	z-index: var(--zindex-nav);
}
#corePageArriereBtn {
	position: fixed;
	bottom: var(--ecart-unite);
	left: 25%;
	z-index: var(--zindex-nav);
}
#corePageAvantBtn {
	position: fixed;
	bottom: var(--ecart-unite);
	right: 25%;
	z-index: var(--zindex-nav);
}
#corePageHomeBtn {
	position: fixed;
	bottom: var(--ecart-unite);
	right: 50vw;
	margin-left: 2em;
	z-index: var(--zindex-nav);
}
#aktone-tiroir-gauche-btn:hover i,
#aktone-tiroir-droite-btn:hover i,
#corePageRetourBtn:hover i,
.corePageBtn:hover i {
	-webkit-transform: scale(1.3);
	transform: scale(1.3);
}
/******************************************************************************\
 *
// ! LOADERS
 *
\******************************************************************************/
.inputspin::before {
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f110";
	color: lightgrey;
	position: absolute;
	left: 8px;
	top: 4px;
	animation-name: spin;
	animation-duration: 2000ms;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
}
.inputspin input[type="text"] {
	padding-left: 28px;
}
@-moz-keyframes spin {
		from { -moz-transform: rotate(0deg); }
		to { -moz-transform: rotate(360deg); }
}
@-webkit-keyframes spin {
		from { -webkit-transform: rotate(0deg); }
		to { -webkit-transform: rotate(360deg); }
}
@keyframes spin {
		from {transform:rotate(0deg);}
		to {transform:rotate(360deg);}
}
#aktone-loader {
	position: absolute;
	z-index: var(--zindex-nav);
	padding-top: 20%;
	height: 100%;
	width: 100%;
	text-align: center;
}

.loader-layer {
	position: absolute;
	top:0;
	left:0;
	width: 100%;
	height: 100%;
	background-color: transparent;
	/* background-color: rgba(255,255,255,0.1); */
	color: lightgrey;
	opacity : 1;
	z-index: var(--zindex-nav);
	text-align: center;
	display: table;
	overflow-x: hidden;
	overflow-y: hidden;
}
.loader-wrap {
	z-index: var(--zindex-nav);
	box-sizing: border-box;
	display: table-cell;
	vertical-align: middle;
	text-align: center;
	padding: 0;
	margin: auto;
}

/******************************************************************************/
/*
/* ! CONSOLE ET DEBUG */
/*
/******************************************************************************/
/* AJAX / JS */
#aktone-page-console,
#aktone-page-debug,
#aktone-page-message,
#aktone-page-message-perm {
	font-size: 0.85em;
	flex: none;
	position: absolute;
	padding: var(--ecart-unite);
	line-height: 22.5px
}
#aktone-page-message-perm {
	position: relative;
	float:left;
	width: 100%;
}
#aktone-page-console > .alert,
#aktone-page-message > .alert {

	border-top-left-radius: 0px;
	border-top-right-radius: 0px;
	border-bottom-left-radius: 0px;
	border-bottom-right-radius: 0px;

	min-height: var(--navbar-unite);
	overflow: hidden;
	width: 100vw;
	margin:0;
	padding: 10px;
	display: table-cell;
	vertical-align: middle;
	z-index: var(--zindex-alert);
	position: fixed;
	left:0;

}
#aktone-page-message > .alert {
	top: 0;
}
#aktone-page-console > .alert {
	bottom:0;
}
#aktone-page-console .close { font-size: 1.5em;  }

#aktone-page-message .valider {
	float: right;
	font-weight: bold;
	line-height: 1;
	color: #FFF;
	background: transparent;
}


/* CONSOLE DEBUG */
#aktone-page-debug {

	--color:yellow;
	--bg:rgba(0,0,0,0.9);
	--bg-titre: #AAA;
	--bg-inter: #EEE;

	position: fixed;
	top: 1vh;
	left: 1vw;
	background: var(--bg);
	color: var(--color);
	width: 60vw;
	height: 80vh;
	resize: both;
	z-index: var(--zindex-alert);
	font-family:monospace;
	font-size: 12px;
	overflow: hidden;
}
.special-page #aktone-page-debug {
	position: relative;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
}

#aktone-page-debug-titre,
#aktone-page-debug .debug-titre {
	width: 100%;
	height: 24px;
	line-height: 14px;
	background: var(--bg-titre);
	color: #000;
	font-size: 14px;
	text-transform: uppercase;
	font-family:monospace;
	padding: 5px;
	overflow: hidden;
}
#aktone-page-debug-titre {
	position: absolute;
	top:0;
	left:0;
}
#aktone-page-debug-contenu {
	padding-top: 24px;
	width: 100%;
	height: 100%;
	overflow: auto;
	overflow-y: scroll;
	padding: 5px;
}
#aktone-page-debug .debug-titre {
	background: var(--bg-inter);
	color: var(--bg);
	margin-top: 30px;
	margin-bottom: 10px;
}

#aktone-page-debug table,
#aktone-page-debug p {
	color: var(--color);
	background: transparent;
	font-size: inherit;
}
#aktone-page-debug p,
#aktone-page-debug pre { margin: 0; border: none; font-size: 1em; }
#aktone-page-debug pre { background: white; }

#aktone-page-debug td {
	border-left: 1px solid var(--color);
	padding: 5px;
}
#aktone-page-debug th {
	border-left: 1px solid var(--color);
	border-bottom: 1px solid var(--color);
	text-transform: uppercase;
	font-weight: bold;
	padding: 5px;
}
#aktone-page-debug th.first,
#aktone-page-debug td.first {
	border-left: 1px solid transparent;
}


/******************************************************************************/
/*
/* ! FORGE */
/*
/******************************************************************************/
.forge-carre {
	min-height:500px;
	min-width:500px;
}
.forge-height {
	min-height:500px;
}
.forge1,
.forge2,
.forge3,
.forge4 {
	float: left;
	display: table-cell;
	text-align: center;
	vertical-align: middle;
	font-size: 3em;
	height: 100%;
	width: 100%;
}
.forge1 {
	background-color: #CCC;
}
.forge2 {
	background-color: #DDD;
}
.forge3 {
	background-color: #EEE;
}
.forge4 {
	background-color: #AAA;
}

/******************************************************************************\
 *
 * ! CORRECTION BOOTSTRAP
 *
\******************************************************************************/

/* form .form-group {
	width: 100%;
	margin-bottom: var(--ecart-unite)
} */

form.form-inline {
	margin-bottom: 0
}
form.form-inline>.form-group {
	width: auto;
	margin-bottom: 0
}
form.form-vertical>.form-group {
	/* padding-top: var(--ecart-unite); */
}
form.form-vertical>.btn-group {
	padding-top: var(--ecart-unite);
}
form.form-vertical>.form-group:first-child {
	padding-top: 0;
}

/* COMPLEMENTS BOOTSTRAP POUR LES FORMS ET MEDIA DANS LES LIST-GROUP */
.list-group-media {
	padding-top: var(--ecart-unite);
}
/* CORRECTION DES DROPDOWNS ORIENTES A DROITE */
.dropdown-menu-right {
		right: 0;
		left: auto;
}
/******************************************************************************\
 *
 * ! CORRECTION XS
 * pour certains objets bootstrap qui n'ont pas cette config dans bootstrap
 *
 * référence de btn-xs :
 * padding: 1px 5px;
 * font-size: 12px;
 * line-height: 1.5
 *
\******************************************************************************/
/* .xbtn-md {
	height: 30px;
	padding: 1px 5px;
	font-size: 12px;
	line-height: 1.5;
	margin:0;
}
.btn-group-md button.btn {
 height: 24px;
 padding: 8px 16px;
 line-height: 24px;
 margin:0;
}
.btn-group-md a.btn {
	height: 24px;
	padding: 8px 16px;
	line-height: 24px;
	margin:0;
} */
.btn-sm {
	height: 30px;
	/* padding: 1px 5px; */
	font-size: 12px;
	line-height: 1.5;
	margin:0;
}
.btn-group-sm button.btn {
 height: 30px;
 padding: 1px 5px;
 font-size: 12px;
 line-height: 1.5;
 margin:0;
}
.btn-group-sm a.btn {
	height: 30px;
	padding: 5px 5px 0 5px;
	font-size: 12px;
	line-height: 1.5;
	margin:0;
}
.btn-xs {
	height: 22px;
	padding: 1px 5px;
	font-size: 12px;
	line-height: 1.5;
	margin:0;
}
.btn-group-xs button.btn,
.btn-group-xs a.btn {
 height: 22px;
 padding: 0px 3px;
 font-size: 12px;
 line-height: 22px;
 margin:0;
}
 /*.btn-sm .badge { font-size: 12px; padding: 2px 5px 2px 5px; }*/
.btn-xs .badge { font-size: 12px; padding: 2px 5px 2px 5px; }
.input-xs {
	height: 22px;
	padding: 1px 5px;
	font-size: 12px;
	line-height: 1.5;
	margin:0;
	margin-bottom:1px;
}
select.input-xs {
	height: 22px;
	line-height: 22px;
}

textarea.input-xs {
	height: auto;
}

/* DROPDOWNS */
.btn-group-md .dropdown-menu > li > a {
	line-height: 18px;
	padding: 8px 14px;
}

/* GLYPHES */
.btn-group-md i.fas {
	/* height: 18px; */
	/* line-height: inherit; */
}
.btn-group-sm i.fas {
	height: 17px;
	line-height: 17px;
}
.btn-group-xs i.fas {
	height: 22px;
	line-height: 22px;
}
.invisible { position: absolute; top: -1000px; left: -1000px; }

.help-block {
	padding:2px 0 0 0;margin:0;height:auto;line-height:1;
}

tr.primary {
	color: #FFF;
}