@import "ContentComment.css";

img#background
{
	position:			fixed;
	z-index:			-1;
	min-height:			100%;
	min-width:			100%;
}

div.row
{
	position: relative; /* Make this div an "anchor" for right-menu */
}

div#content {
	background: #FFF;
	min-height: 500px;
	padding: 10px;
}

div#content > * {
	max-width: 1226px;
}

.backToTop,
.backToTop a,
.backToTop:hover,
.backToTop a:hover {
	padding: 0;
	text-align: center;
	text-decoration: none !important;
	position: fixed;
	right:	120px;
	display: none;
	bottom: 15px;
	z-index: 1;
	cursor: pointer;
	-ms-transform: translate(400%); /* IE 9 */
	-webkit-transform: translate(400%); /* Safari */
	transform: translateX(400%);
}

a.backToTop .glyphicon {
	font-size: 2em !important;
}

.scrollToTop:hover {
	text-decoration: none;
}

form.form-inline
{
	margin-left:		0 !important;
}


/* Add CSS classes to indicate whether or not the current page has left/right menus */
div#content.no-left-menu.show-right-menu {
	float: left;
	width: 76.2%;
}

div#header .navbar
{
	display: flex;
	margin-left:		auto;
	margin-right:		auto;
}

div#header .navbar ul
{
	text-align:		center !important;
}

div#footer *
{
	color:			#1A4869 !important;
}

div#header .navbar li.section a, div#header .navbar a:hover
{
	background-color:	#E1E723 !important;
	text-decoration:	none !important;
}

/*ul.side-menu-level-1 a:hover, ul.side-menu-level-2 a:hover,*/
/*ul.side-menu-level-1 a.section, ul.side-menu-level-2 a.section*/
/*{*/
/*	color:			#006450 !important;*/
/*}*/

/* TODO: CHECK IF NEEDED / MOVE */
ul.side-menu-level-1 a:hover:before, ul.side-menu-level-2 a:hover:before,
ul.side-menu-level-1 a.section:before, ul.side-menu-level-2 a.section:before
{
	content:		'» ';
	position:		absolute;
	left:		-20px;
}

ul.side-menu-level-1 > li
{
	margin-bottom: 		4px;
}

h1
{
	margin-bottom:		15px !important;
}

div#content hr
{
	background-color:			#AEB0C2 !important;
	border:					none !important;
	-webkit-border-radius:			0 !important;
	-moz-border-radius:			0 !important;
	border-radius:				0 !important;
	height:					1px !important;
	margin-top:				20px !important;
	margin-bottom:				20px !important;
}

/* FIXME: Use less !important priorization above! Fix by using more specific selectors or by changing the original values (if not located in bootstrap.css) */



a.toggle-document-description, a.toggle-document-summary, a.toggle-document-memo
{
	align-self: start;
}

ul.news-list
{
	background: unset;
	overflow-wrap: break-word;
	padding: 0;
	word-wrap: break-word;
}

/* A single "news item" */
ul.news-list > li {
	background: #F9F9FC;
	border-radius: 3px;
	line-height: 22px;
	margin-bottom: 7px;
	padding: 16px;
}
/* A single "news item" - text part */
.news-item-content {
	--max-lines: 5;
	overflow: hidden;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: var(--max-lines);
	transition: height 0.3s;
}

/* Remove height limit from the news item when it's been expanded */
.news-item-content:has(+ .expand-news-item-button:checked) {
	-webkit-line-clamp: unset;
	height: auto;
}

/* The toggles for "show more" in the news items */
.expand-news-item-button {
	appearance: none;
	color: #515CBF;
	cursor: pointer;
	display: inline-block;
	font-size: 12px;
	font-weight: 600;
	margin-top: 12px;
	text-align: center;
	text-decoration: underline;
	width: 100%;
}

.expand-news-item-button::before {
	content: "Lue lisää"
}

.expand-news-item-button:checked::before {
	content: "Pienennä"
}

ul.news-list a:hover
{
	color:				#1A4869 !important;
}

ul.news-list a:hover:before
{
	Content:			'';
}



/* For the References page (Referenssit) */
div.slick-carousel-slide img
{
	display: block;
	width: 100%;
	height: auto;
}
/* For the References page (Referenssit) */


ul.side-menu-level-1 span.expand-level-2
{
	display: block;
}

.nobr
{
	white-space:			nowrap;
}

table.border tr
{
	border:				1px solid #aaa;
}

table.border td, table.border th
{
	padding:			5px;
}

form#DocumentVersionSelector.disabled
{
	background: #EEEEEE;
	color: #777777;
}

form#DocumentVersionSelector.disabled::after
{ 
    content: "Vain yksi versio julkaistu.";
    font-size: smaller;
	font-style: italic;
	color: #777777;
}

form#DocumentVersionSelector select:disabled
{
	background: #EEEEEE;
}



.disabled-section
{
	pointer-events: none;
	opacity: 0.5;
}

.hidden-section
{
	display: none;
}

/* Messages */
.message {
    background-color: #fef4ba;
    padding: 5px 10px;
    border: 1px solid #e8c805;
    border-radius: 3px;
}

.good {
    background-color: #ecf9d0;
    border-color: #8fbe00;
}

.message.inline
{
	display: inline;
	margin: 0px;
	padding: 1px 3px;
    border: 3px solid #e8c805;
    border-radius: 6px;
}

.message.inline.say-ajax-in-progress::after
{
    content: "Päivittää...";
	font-style: italic;
}

.message.inline.error
{
	color: white;
	background-color: red;
	border: 3px solid red;
	font-weight: bold;
}

.message.inline.error.say-ajax-failed::after
{
    content: "Päivitys epäonnistui!";
}

input[type=submit]
{
	float: none !important;
}

div#left-menu, div#right-menu
{
	hyphens: auto; /* Use the browser's hyphenation if supported. If not supported, there is a JS file included at the bottom of every page which performs the hyphenation for browsers which do not support the 'hyphens' CSS rule. */
}

div#right-menu ul
{
	/* TODO: Will be removed when implementing hyphenation. */
	word-wrap: break-word;
}


/* Read/Unread marks */
.read-mark
{
	background: #FFF;
	border-radius: 50%;
	display: inline-block;
	height: 12px;
	line-height: 12px;
	vertical-align: middle; /* Without this, the unread icon would be placed a little bit too high */
	width: 12px;
}
.read-mark.unread
{
	background: #E1E723; /* same yellow as in the company logo */
}

/* PDFJobPage.ss & PDFJobPage_list_ajax.ss */
.pdf-jobs-page ul#PDFSendEmailOption li {
	list-style-type: none;
}

.pdf-jobs-page span.PDFSendEmailOption-saved {
	display: none;
}

.pdf-jobs-page table#pdf-table {
	width: 100%;
}

.pdf-jobs-page table#pdf-table tr {
	vertical-align: top;
}

.pdf-jobs-page table#pdf-table td {
	padding: 5px;
}

.pdf-jobs-page table#pdf-table thead th {
	text-align: center;
}

.pdf-jobs-page table#pdf-table tbody td.pdf-table-col--last-edited,
.pdf-jobs-page table#pdf-table tbody td.pdf-table-col--status,
.pdf-jobs-page table#pdf-table tbody td.pdf-table-col--no-file {
	text-align: center;
}

.pdf-jobs-page table#pdf-table tbody td.pdf-table-col--no-file::before {
	content: "-";
}

.pdf-jobs-page table#pdf-table a.file-download-link {
	display: inline-block;
	white-space: nowrap;
}

/* SEARCH FORM
   (cumbersome to customize the style because the form html is generated within SilverStripe)
*/
.search-form-container {
	font-weight: 400;
	line-height: 20px;
	padding: 18px 18px 0 18px;
	width: 590px;
}

.search-form-container .search-context-description {
	font-size: smaller;
	font-style: italic;
}

.search-form-container fieldset > div.field .fieldholder-small,
.search-form-container fieldset > div.field.text {
	display: grid;
	grid-template-columns: 200px 1fr;
}
.search-form-container fieldset > div.field > div.field.CompositeField.month {
	display: grid;
	grid-template-columns: 2fr 1fr;
}
.search-form-container fieldset > div.field > div.field.CompositeField.month div.Year {
	display: grid;
	grid-template-columns: 200px 1fr;
}

.search-form-container fieldset > div.field > div.field.CompositeField.month div.Year select.Year {
	width: 180px;
}

.search-form-container fieldset > div.field > div.field.CompositeField.month select.Month {
	width: 100%;
}

.search-form-container fieldset label {
	font-weight: 400;
	line-height: 20px;
}

.search-form-container fieldset label strong {
	font-weight: 400;
}

/* FIELD "Hakusanat" */
.search-form-container fieldset > div.field .fieldholder-small,
.search-form-container fieldset #Form_no-controller-method-name_haku_Holder,
/* FIELD "Määritä hakukohteet" */
.search-form-container fieldset > div.field.CompositeField:first-of-type div.fieldgroup-field.even,
/* FIELD "Diaarinumero" */
.search-form-container fieldset #Form_no-controller-method-name_diaari_Holder,
.search-form-container fieldset #Form_SearchForm_diaari_Holder,
/* FIELD "Lakiryhmät" */
.search-form-container fieldset #Form_no-controller-method-name_ryhma_Holder,
.search-form-container fieldset #Form_SearchForm_ryhma_Holder,
/* FIELD "Lakialueet" */
.search-form-container fieldset #Form_no-controller-method-name_alue_Holder,
.search-form-container fieldset #Form_SearchForm_alue_Holder,
/* FIELD "Vastuuhenkilöt" */
.search-form-container fieldset #Form_no-controller-method-name_vastuuhenkilot_Holder,
.search-form-container fieldset #Form_SearchForm_vastuuhenkilot_Holder,
/* FIELD "Kuittaukset" */
.search-form-container fieldset #Form_no-controller-method-name_kuittaukset_Holder,
.search-form-container fieldset #Form_SearchForm_kuittaukset_Holder,
/* FIELD "Hae ainoastaan lait, joissa minun tai yritykseni tekemiä kommetteja" */
.search-form-container fieldset #Form_no-controller-method-name_kommentit_Holder,
.search-form-container fieldset #Form_SearchForm_kommentit_Holder {
	align-items: center;
	display: grid;
	grid-template-columns: 160px 400px;
}
/* FIELD "Määritä hakukohteet" - need to set exact height */
.search-form-container fieldset > div.field.field.CompositeField.fieldgroup.nolabel > div > div:nth-child(2) {
	height: 36px;
}
/* FIELD "Määritä hakukohteet" - move expanded contents to the second column since it has more space */
.search-form-container #Form_no-controller-method-name_konteksti,
.search-form-container #Form_SearchForm_konteksti,
.search-form-container #Form_no-controller-method-name > fieldset > div.field.field.CompositeField.fieldgroup.nolabel > div > div.fieldgroup-field.last.even > span,
.search-form-container #Form_SearchForm > fieldset > div.field.field.CompositeField.fieldgroup.nolabel > div > div.fieldgroup-field.last.even > span {
	grid-column: 2;
}
/* For the checkbox fields move the label before the checkbox */
.search-form-container fieldset > div.field.CompositeField:first-of-type div.fieldgroup-field.even label,
.search-form-container fieldset #Form_no-controller-method-name_kommentit_Holder label,
.search-form-container fieldset #Form_SearchForm_kommentit_Holder label {
	order: -1;
	padding-left: 0;
	padding-right: 2px;
}
.search-form-container fieldset #Form_no-controller-method-name_kommentit_Holder input[type=checkbox],
.search-form-container fieldset #Form_SearchForm_kommentit_Holder input[type=checkbox] {
	position: unset; /* remove the absolute position so that the grid layout works */
	margin: 0;
}

.search-form-container fieldset div.field label {
	margin-bottom: 0;
}

/* FIELDS "Julkaistu aikaisintaan" & "Julkaistu viimeistään" */
.search-form-container fieldset > div.field > div.field.CompositeField.month {
	display: grid;
	grid-template-columns: 360px 200px;
	margin: 0;
}
.search-form-container fieldset > div.field > div.field.CompositeField.month div.Year {
	align-items: center;
	display: grid;
	grid-template-columns: 160px 190px;
}
.search-form-container fieldset > div.field > div.field.CompositeField.month select.Year {
	width: 100%;
}
.search-form-container fieldset > div.field > div.field.CompositeField.month select.Month {
	width: 190px;
	float: right;
}

/* Custom border colors for the "Chosen" library fields */
.search-form-container fieldset ul.chosen-choices {
	border-color: #dad9d9;
}

.search-form-container div.fieldgroup {
	margin: 0;
}
form#MemberLoginForm_LoginForm,
form#MemberLoginForm_LostPasswordForm {
	width: max-content;
	min-width: 300px;
}

form#MemberLoginForm_LoginForm .Actions input[type=submit],
form#MemberLoginForm_LostPasswordForm .Actions input[type=submit],
.search-form-container .Actions input[type=submit] {
	background: #5664E2;
	border-radius: 3px;
	float: right !important;
	font-size: 9px;
	font-style: normal;
	height: 23px;
	margin: 0;
	text-transform: uppercase;
}

label[for=MemberLoginForm_LoginForm_Remember].right {
	float:initial;	 /* place checkbox on the left side */
}

.econet-sub-page-link-container a {
	text-decoration: underline;
}