:root{--lightgreen : #c3ee0a;}

/* Général */
header{margin-bottom: 5rem; position: relative;}
body {font-size: 16px; font-family: 'Montserrat', sans-serif !important; color: #1c1b1c;}
a{color: black !important; text-decoration: none !important; width: fit-content;}
.btn-green { background-color: var(--lightgreen) !important;}
h1 {text-align: center; font-size: 2rem; font-weight: bold;}
p {margin: 0 !important;}
article{padding: 1rem;}
td{vertical-align: middle;}

/* Générateur */
#generateurQr{display: flex; justify-content: center; align-items: center; flex-direction: column;}
#generateurQr .container{display: grid; grid-template-columns: 1fr 1fr; order: 1; margin-bottom: 2rem;}
#msg{order: 0;}
.container {background-color: #efefef; box-shadow: 0px 3px 6px rgba(0,0,0,0.16); padding: 2em;}
.visu-qrc {margin-left: 4em;}
#qrc {position: relative; background: url("/img/alpha-bgr.png") center no-repeat; background-size: cover; min-height: 350px; min-width: 350px;}
#qrc:after {content: ''; display: block; padding-bottom: 100%;}
#qrc > div {position: absolute; width: 100%; height: 100%;}
#qrc > div svg {height: 100% !important; width: 100% !important;}


/* Formulaire */
.form {height: max-content;}
.form div {margin-bottom: 0.5em; display: flex; flex-direction: column;}
#radio-transparent, #radio-couleur {display: flex; flex-direction: row;}
select, textarea, input, #btnSupprimer {margin-bottom: 1rem !important;}
.form input:focus,
.form textarea:focus,
.form select:focus {border-color: var(--lightgreen); outline: var(--lightgreen); box-shadow: none;}
.form > button span{z-index: 1; position: relative;}
input[type="radio"]{margin-right: .25rem;}
#radio-transparent label, #radio-couleur label{margin-right: 1rem;}
#btnSupprimer {margin-right: 1rem;}
.alert-success, .alert-copy{background-color: var(--lightgreen) !important; color: black !important;}
.alert-copy{width: min-content;}
.input-group input {margin-bottom: 0 !important;}
.far.show-pwd.fa-eye:hover, .far.show-pwd.fa-eye-slash:hover {cursor: pointer;}
table input[type="checkbox"]{margin-bottom: 0 !important;}
.colonne-lien {cursor: pointer;}
#tri {width: fit-content; margin: 0 0 0 1em !important;}
.input-group:not(.mdp) {width: fit-content;}
#search, #searchbtn {height: fit-content; width: fit-content;}
#searchbtn {background-color: var(--lightgreen); color: #000000; outline: var(--lightgreen); border-color: var(--lightgreen);}

/* Button */
.form > button, .modifier, .telecharger, .retour, .visualiser, .exporter, .reset {display: block; margin: 0 auto; box-shadow: none; text-shadow: none; cursor: pointer; background: transparent; position: relative; padding: 0.5em 1em; border: 0; overflow: hidden; transition: all 0.15s ease-out;}
.form > button:after, .modifier:after, .telecharger:after, .retour:after, .visualiser:after, .exporter:after, .reset:after {content: ''; position: absolute; top: 95%; left: 0; width: 100%; height: 100%; background-color: var(--lightgreen); z-index: 0; transition: all 0.15s ease-out;z-index: -1;}
.form > button:hover:after, .telecharger:hover:after, .modifier:hover:after, .retour:hover:after, .visualiser:hover:after, .exporter:hover:after, .reset:hover:after {top: 0;}
.table-container{margin: 0 auto 5em auto;}
.modifier, .telecharger, .retour, .visualiser, .exporter{margin: 0; z-index: 2; }
.retour, .exporter{margin: 1rem 2rem;}
#resetFilters {font-size: .8em; margin-right: 0; margin-top: 1em;}

/* Tooltip */
#tooltipImg{position:absolute; box-shadow: 5px 5px 15px -5px #000000; background-color: white;}
table {table-layout: fixed;}
table > thead > tr > th:first-of-type {width: 40px;}
.colonne-lien {word-break: break-all;}
#loginpage {padding-top: 4em;}

@media (max-width: 991px) {
	.container {flex-direction: column; align-items: center;}
	.container > article {width: 100%;}
	#content-list-input.type-contact {column-count: 1;}
	.visu-qrc {display: none;}
}