/* Styles for main content */
/* Generally should be sufficiently scoped as to be safe to include in the admin views too */

:root {
	--uk-old-blue: hsl(218, 80%, 28%);
	--uk-new-blue: hsl(232, 44%, 28%);
	--uk-new-yellow: hsl(44.4, 100%, 61%);
}

/* Body */
.entry {
	background: white;
	padding: 2em;
	padding-top: 0px;
}

/* Paragraphs */
.view-article .entry > p,
.view-article .entry > li,
.view-custom-page .entry > p,
.view-custom-page .entry > li,
.view-custom-page .entry .expandtext > p,
.view-custom-page .entry .expandtext > li {
	text-align: justify;
}

/* Links */
.entry a {
	color: hsl(225, 70%, 50%);
	text-decoration: none;
	border-bottom: 1px solid hsl(225, 70%, 80%);
}
.entry a:hover,
.entry a:active {
	color: hsl(225, 70%, 30%);
	text-decoration: none;
	border-bottom: 2px solid hsl(225, 70%, 60%);
	border-bottom-color: var(--uk-new-yellow);
}

/* Emphasized links */
.content a.chip {
	display: inline-block; /* for line-wrapping */
	border-radius: 5px;
	padding: 0.15em 0.35em;
	text-decoration: none;
	text-align: initial;
}
/* Emphasized links - basic */
.content a.chip {
	color: var(--light-hl);
	background: var(--light-bg);
	border: 1px solid var(--light-bg-hl);
}
.content a.chip:hover, .entry a.chip:focus {
	background: var(--light-bg-hl);
}
/* Emphasized links - bold */
.content a.chip.bold {
	color: hsl(225, 50%, 100%);
	background: hsl(225, 70%, 30%);
	border-color: transparent;
}
.content a.chip.bold:hover, .entry a.chip.bold:focus {
	background: hsl(225, 50%, 40%);
}
/* Emphasized links - frills */
.content a.chip.large {
	font-size: larger;
}
.content a.chip.light:not(:hover):not(:focus) {
	background: transparent;
	border-color: transparent;
}
/* In main page body, automatically add → arrow */
/* XXX: Eventually, maybe, just create a different class for 'admin' links
 * (and merge it with the news-article "read more" class) instead of this
 * hacky opt-out */
.content .entry a.chip::after {
	content: "\f178";
	font-family: "FontAwesome";
	font-style: normal;
	display: inline-block;
	margin-left: 0.2em;
	text-decoration: none;
}
.content .entry a.chip.bare::after {
	display: none;
}

/* Broken link decorations */
/* CustomPage generates such links for inactive pages */
.entry a[href^="/inactive-page"],
.entry a[href^="/missing-page"] {
	color: crimson;
	text-decoration: line-through;
}
.entry a[href^="/inactive-page"]::after,
.entry a[href^="/missing-page"]::after {
	font: normal normal normal 90%/1 FontAwesome;
	text-decoration: none;
	display: inline-block; /* make text-decoration work */
	padding-left: 2pt;
}
.entry a[href^="/inactive-page"]::after {
	content: "\f023"; /* fa-lock */
}
.entry a[href^="/missing-page"]::after {
	content: "\f127"; /* fa-chain-broken */
}

/* Headings */
h1.page-title {
	/* Main heading above the .entry */
	color: var(--uk-new-blue);
}
.entry h1 {
	/* Mostly not used */
}
.entry h2, .entry h3, .entry h4 {
	margin: 1rem 0;
	break-after: avoid;
}
.entry h2 {
	color: #222222;
	font-weight: bold;
	font-size: 17pt;
}
.entry h3 {
	color: #222222;
	font-weight: bold;
	font-size: 15pt;
}
.entry h4 {
	font-weight: bold;
	font-size: 13pt;
}

/* Horizontal lines */
.entry hr {
	background: #e5e5e4;
	height: 1px;
	display: block;
	border: 0;
}

/* Numbered lists */
.entry ol {
	line-height: 1.5em; /* match style.css:body{font} */
}
.entry ol li {
	margin: 1em 0;
}

/* Bullet lists */
.entry ul {
	line-height: 1.5em; /* match style.css:body{font} */
	padding: 0;
	position: relative;
}
.entry ul li {
	margin: 1em 0;
	list-style: none;
	position: relative;
	padding-left: 30px;
}
.entry ul li:first-child {
	/* Normally the first-child margin collapses with the preceding <p> margin,
	 * but that doesn't occur when the <ul> is set to have multiple columns.
	 * I'm not sure if we actually need the 'li { margin: }' above, but while
	 * we have it, it seems to be harmless to zero the first-child margin.
	 */
	margin-top: 0;
}
.entry ul li:before {
	/* Custom bullet */
	content: "";
	-ms-transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
	position: absolute;
	top: 0;
	left: 7px;
	margin: 8px 4px;
	width: 8px;
	height: 8px;
	background-color: hsl(48, 100%, 50%);
}

.entry .entry-social ul li:before {
	/* Custom bullet */
	content: ""
}

.entry .entry-social .date-format {
	float: left;
	margin-right: 7px;
}

.entry .entry-social ul li {
	display: inline-block;
	border: 1px solid #152C70;
	border-radius: 50%;
	width: 40px;
	height: 40px;
	margin-right: 3px;
	margin-left: 3px;
	color: #152C70;
}


.entry ul.dim li:before,
.entry li ul li:before {
	/* 2nd-level items should be dimmer. */
	background-color: hsl(48, 0%, 80%);
}
.entry li li ul li:before {
	/* 3rd-level items should use round bullets. */
	border-radius: 999px;
}

/* Illustrations */
/* https://www.utenos-kolegija.lt/visuomenei/paslaugos/nuoma-ir-apgyvendinimas */
.entry figure.float {
	float: right;
	margin-left: 1em;
	max-width: 40%;
}
.entry figure.float img {
	width: 100%;
}

/*------------------------------------------------------------------------------*/
/* Styled paragraphs for extra emphasis */
/* https://www.utenos-kolegija.lt/studentams/parama-studentams/stipendijos */
.svarbu, .labai-svarbu {
	margin: 0.8em;
	border-radius: 5px;
	padding: 0.5em 0.8em;
}
.svarbu {
	color: hsl(218, 80%, 28%);
	background: hsl(218, 80%, 96%);
}
.labai-svarbu {
	color: hsl(0, 80%, 40%);
	background: hsl(0, 80%, 97%);
}

/*------------------------------------------------------------------------------*/
/* Regular tables */
.entry table {
	margin: 1rem 0;
	max-width: 100%;
}
.entry table th,
.entry table td {
	padding: .6rem;
	line-height: 1.5;
	vertical-align: top;
	border: 1px solid hsl(225, 40%, 85%); /* a lighter version of light-fg */
}
.entry table th {
	background: var(--light-bg);
}

/* Dimmed down */
.entry table.dim {
}
.entry table.dim th,
.entry table.dim td {
	border: 1px solid hsl(60, 2%, 90%);
}
.entry table.dim th {
	background-color: #f5f5f5;
}

/* Make <p> inside table cells look less bad */
.entry table p:last-child {
	margin-bottom: 0;
}

/*------------------------------------------------------------------------------*/
/* Tables with odd/even rows */
/* https://www.utenos-kolegija.lt/stojantiesiems/priemimas/studiju-programos-ir-kainos */
.entry table.oddeven {
	border: none;
}
.entry table.oddeven tr {
	border-top: 1px solid var(--light-fg);
	border-bottom: 1px solid var(--light-fg);
}
.entry table.oddeven tbody tr:nth-child(odd) {
}
.entry table.oddeven tbody tr:nth-child(even) {
	background: hsl(225, 30%, 97.5%); /* even lighter version of light-bg */
}
.entry table.oddeven th {
	border: none;
	border-left: 1px solid var(--light-fg);
	border-right: 1px solid var(--light-fg);
	background: var(--light-bg);
}
.entry table.oddeven th:first-child {
	border-left: none;
}
.entry table.oddeven th:last-child {
	border-right: none;
}
.entry table.oddeven td {
	border: none;
}

/*------------------------------------------------------------------------------*/
/* Journal articles */
/* https://www.utenos-kolegija.lt/visuomenei/zurnalas-izvalgos/2023-nr-1 */
.izvalgos .article .author {
}
.izvalgos .article .title[lang="lt"] {
	/* Equalize top/bottom margins */
	margin: 0.2rem 0;
}
.izvalgos .article .title[lang="en"] {
}

/*------------------------------------------------------------------------------*/
/* History timeline */
/* https://www.utenos-kolegija.lt/kolegija/fakultetai/verslo-ir-technologiju-fakultetas/fakulteto-istorija */
table.timeline tr {
	border-top: 1px solid hsl(48, 30%, 90%);
}
table.timeline tr:first-child {
	border-top: none;
}
table.timeline tr th,
table.timeline tr td:first-child {
	font-size: larger;
	font-weight: bold;
	text-align: right;
	white-space: nowrap;
	padding: 0.5em 1em 0.5em 0;
	border-right: 2px solid hsl(48, 30%, 85%);
}
table.timeline tr td:last-child {
	padding: 0.5em 0 0.5em 1em;
}

/*------------------------------------------------------------------------------*/
/* Collapsible (accordion) sections */
/* e.g. https://www.utenos-kolegija.lt/stojantiesiems/priemimas */
.accordion {
	margin-top: 40px;
}
.expandhead {
	cursor: pointer;
	display: inline-block;
	border-left: 2px solid var(--uk-new-blue);
	color: #000;
	padding: 0.4em 0.6em 0.2em;
	width: 100%;
	text-align: left;
	margin-bottom: 15px;
}

.expandhead::before {
	width: 0;
	height: 0;
	border-left: 5px solid transparent;
	border-right: 5px solid transparent;
	border-top: 7px solid var(--uk-new-blue);
	content: "";
	position: absolute;
	right: 0;
	clear: both;
	margin-bottom: 1rem;
	margin-right: 15px;
}
.expandhead.active::before {
	border-bottom: 7px solid var(--uk-new-blue);
	border-top: 0;
}

.expandhead div {
	font-size: 14px;
}
.expandhead h2,
.expandhead h3 {
	color: #000;
	/* Really it should be auto everywhere, but let's fix just this one. */
	margin: auto;
	font-weight: 700;
	font-family: 'Open Sans';
	font-size: 16px;
}
.expandtext {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.2s ease-out;
	/* Side padding must be specified, as the content is still visible
	 * during transition... but top/bottom padding must be zero. */
	padding: 0 1em;
	border-width: 0px 0px 0px 2px;
	border-style: solid;
	border-color: hsl(55, 38%, 94%);
	margin-top: -15px;
	margin-bottom: 30px;
}
.expandtext > *:first-child {
	/* Hack because we can't have top/bottom padding while collapsed,
	 * and we can't alter padding while animating... */
	margin-top: 1em;
}

/* Active sections */
.expandhead.active {
	border-color: var(--uk-new-yellow);
}
.expandtext.visible {
	overflow-x: auto;
	border-color: var(--uk-new-yellow);
}

/*------------------------------------------------------------------------------*/
/* Included subpages */
/* https://www-dev.utenos-kolegija.lt/stojantiesiems/priemimas */
div.included {
}
.admin-links {
	font-size: 9pt;
	display: inline-block; /* for hover opacity */
}
.admin-links:not(:hover):not(:focus) {
	opacity: 0.5;
}
.admin-links a.chip:not(:hover):not(:focus) {
	/* Tone down the chip style */
	background: transparent;
	border-color: transparent;
}