/** Variables - Where the most of the magic happens **/

:root {
  --color--primary:#e43e34;
	--color--secondary:#9a0e09;
}


/** Style Global **/

*{
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
-moz-box-sizing: border-box;    /* Firefox, other Gecko */
box-sizing: border-box;         /* Opera/IE 8+ */
	}

	body{
		background:#f9f9f9;
	}

	button,a, input[type="submit"]{
		-webkit-transition: all 0.25s ease-in-out 0s;
		transition: all 0.25s ease-in-out 0s;
	}

#container{
	min-height: 100vh;
	display: flex;
	flex-direction: column;
}

/* django 3 has added two divs wrapping the <div id=content> and the <footer> */
#main > div.content{
	display: flex;
	flex-direction: column;
}

body.login #container{
  min-height: inherit;
  justify-content: center;
}
body.login #container #branding{
  float: none;
  width: 100%;
  text-align: center;
}
body.login #container .admin__footer{
  text-align: center;
}

.module h2, .module caption, .inline-group h2{
	background: white;
	color:black;
	font-weight: bold;
	font-family: 'Baloo', cursive;
}

h1{
	font-family: 'Baloo', cursive;
}

.module caption, .inline-group h2{
	font-size: 13px;
}
.module{
	/* box-shadow: 0px 1px 10px rgba(1,1,1,0.03); */
	border-radius: 5px;
	/* overflow:hidden; */
	padding:10px 15px;
}

a.section:link, a.section:visited{
	color: black;
}

/** Header **/

#header, .breadcrumbs, #content, footer{
	width: 100%;
}
#header{
	height: auto;
	background: white;
	color:var(--color--primary);
	display: flex;
	align-items: center;
	justify-content: space-between;
}

#header a:link, #header a:visited{
	color:black;
	font-weight: 400;
}

#header a:link:hover, #header a:visited:hover{
	color:var(--color--primary);
	border-color:var(--color--primary);
}

div.breadcrumbs, thead th, thead th.sorted{
	background: var(--color--secondary);
	color: white;
}

div.breadcrumbs{
	background:linear-gradient(to right, var(--color--primary), var(--color--secondary));
}


table thead th .text a:focus, table thead th .text a:hover, .object-tools a:link, .object-tools a:visited, .button, input[type=submit], input[type=button], .submit-row input, a.button, .button.default, input[type=submit].default, .submit-row input.default{
	background:linear-gradient(to right, var(--color--primary), var(--color--secondary));
	-webkit-transition: all 0.25s ease-in-out 0s;
  transition: all 0.25s ease-in-out 0s;
}


/** Filters **/

#changelist #toolbar {
  background: none;
}
#changelist-filter {
  background: white;
  border: 1px solid #eee;
  max-width: 240px;
}
#changelist-filter h2 {
  border-bottom: 1px solid #eee;
}
#changelist-filter li.selected a {
  color: var(--color--primary);
}
#changelist-filter li.selected a:hover,
#changelist-filter li a:hover {
  color: var(--color--secondary);
}

.select2-container--admin-autocomplete .select2-results__option--highlighted[aria-selected] {
  background-color: var(--color--secondary);
}

/** Calendar **/

.datetimeshortcuts .date-icon {
  background: url("../img/icon-calendar.svg") 0 0 no-repeat;
}
.calendar td a:focus,
.timelist a:focus,
.calendar td a:hover,
.timelist a:hover,
.calendar td.selected a {
  background-color: var(--color--secondary);
}


/** Boutons **/

.button:active, input[type=submit]:active, input[type=button]:active, .button:focus, input[type=submit]:focus, input[type=button]:focus, .button:hover, input[type=submit]:hover, input[type=button]:hover, .button.default:active, input[type=submit].default:active, .button.default:focus, input[type=submit].default:focus, .button.default:hover, input[type=submit].default:hover, .object-tools a:link:hover{
	background:linear-gradient(to right, var(--color--primary), var(--color--secondary));
	transform: scale(1.04);
}

.button-disabled{
  background: #999 !important;
  cursor: not-allowed;
}

.delete-confirmation form .cancel-link {
  height: auto;
  display: initial;
}

.submit-row a.deletelink{
	height: auto;
}

.submit-row a.deletelink:hover{
	transform: scale(1.04);
}

.object-tools a.viewsitelink, .object-tools a.golink, .object-tools a.addlink{
	padding-right: 12px;
}

.object-tools a:link, .object-tools a:visited{
	color: white;
}

a:link, a:visited{
	color: var(--color--primary);
}

thead th a:link, thead th a:visited{
	color:white;
}

td, th{
	border: none;
}

#content-related{
	background: white;
}

.form-row{
	padding-left: 20px;
}

.admin__logo{
	width: 90px !important;
  height: auto;
}
#branding{
  height: auto;
  line-height: 1;
}


/** Changelist: sticky header 
#changelist-form .results {
    overflow-x: visible;
}
#changelist table thead th {
    position: sticky;
    top: 0px;
}
**/


/** Paginator **/
.paginator a.showall {
  color: var(--color--primary);
  background-color: white;
}
.paginator a.showall:link,
.paginator a.showall:visited,
.paginator a.showall:hover {
  color: var(--color--secondary);
  background-color: white;
}

.paginator a:link,
.paginator a:visited {
  background-color: var(--color--primary);
}
.paginator a:hover {
  background-color: var(--color--secondary);
}


/** Inline **/
thead th.required {
  color: white;
}

/** Inline into fieldsets **/
.inline-group--fielset .inline-group {
  margin: 0px;
  padding-bottom: 10px;
  border-bottom: 1px solid #eee;
}
.inline-group--fielset h2 {
	font-weight: normal;
    color: #666;
	font-size: 13px;
	letter-spacing: none;
	text-transform: none;
	font-family: "Roboto","Lucida Grande","DejaVu Sans","Bitstream Vera Sans",Verdana,Arial,sans-serif;
}
.inline-group .tabular td.original p {
	display: none;
}
.inline-group .tabular tr.has_original td.field-file {
	padding-top: 1em;
}
.inline-group .tabular tr.has_original td.field-file p {
	font-size: large;
}

/** Footer **/

footer{
	background: white;
	margin-top: auto;
}
.footer__logo{
	width: 105px;
	margin: 15px 0px 15px 40px;
}