﻿/*==================================================
 * InfoPage.css - skupni videz informativnih strani portala (wms/Info.aspx, IskanjeNavodila.aspx)
 *
 * Barve teme (--tm-*) in obvestilo (tm-toast) so v /mapguide/gis/MojiPodatki/tematike.css.
 *
 *   ip-header   glava: logotip portala, naslov, naziv aplikacije, izbira jezika
 *   ip-main     vsebina največ 960 px; ip-card kartica, ip-section naslovi razdelkov
 *   ip-note     poudarjena opomba; ip-footer noga
 * ===============================================*/
body.ip-page {
	font-size: 13px;
	background-color: var(--tm-bg);
}

/*==================================================
 * glava
 * ===============================================*/
.ip-header {
	color: #ffffff;
	background-color: var(--tm-primary);
	border-bottom: 1px solid var(--tm-primary-light);
}
.ip-header-inner {
	display: flex;
	align-items: center;
	gap: 16px;
	box-sizing: border-box;
	max-width: 960px;
	margin: 0 auto;
	padding: 12px 18px;
}
/* logotip je ikonska pisava (kaliopalogo) v barvi besedila, zato na beli podlagi v barvi teme */
.ip-logo {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	padding: 4px 8px;
	color: var(--tm-primary);
	background-color: #ffffff;
	border-radius: 6px;
}
.ip-logo .logo {
	font-size: 30px;
	line-height: 1;
}
.ip-titles {
	flex: 1 1 auto;
	min-width: 0;
}
.ip-title {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 0;
	font-size: 18px;
	font-weight: bold;
	line-height: 1.3;
	color: #ffffff;
}
.ip-title > i {
	font-size: 20px;
	opacity: 0.9;
}
.ip-subtitle {
	margin: 3px 0 0 0;
	font-size: 13px;
	color: rgba(255, 255, 255, 0.85);
}
.ip-lang {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	gap: 6px;
	color: #ffffff;
}
.ip-lang > i {
	font-size: 18px;
}
.ip-lang-select {
	height: 28px;
	padding: 0 6px;
	font-family: inherit;
	font-size: 12px;
	color: var(--tm-text);
	background-color: #ffffff;
	border: 1px solid var(--tm-primary-light);
	border-radius: 6px;
}

/*==================================================
 * vsebina
 * ===============================================*/
.ip-main {
	box-sizing: border-box;
	max-width: 960px;
	margin: 0 auto;
	padding: 18px 18px 24px 18px;
}
.ip-card {
	margin-bottom: 14px;
	padding: 18px 22px 22px 22px;
	line-height: 1.6;
	background-color: #ffffff;
	border: 1px solid var(--tm-border);
	border-radius: var(--tm-radius);
}
.ip-card p {
	margin: 0 0 10px 0;
}
.ip-section {
	display: flex;
	align-items: center;
	gap: 10px;
	margin: 22px 0 10px 0;
	padding-bottom: 6px;
	font-size: 15px;
	font-weight: bold;
	color: var(--tm-text);
	border-bottom: 2px solid var(--tm-border);
}
.ip-section:first-child {
	margin-top: 0;
}
.ip-section > i {
	font-size: 17px;
	color: var(--tm-primary);
}
.ip-note {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	padding: 8px 12px;
	background-color: var(--tm-bg);
	border-radius: 6px;
}
.ip-note > i {
	flex: 0 0 auto;
	margin-top: 3px;
	color: var(--tm-primary);
}
.ip-empty {
	margin: 0;
	padding: 8px 12px;
	color: var(--tm-muted);
	background-color: var(--tm-bg);
	border-radius: 6px;
}
.ip-footer {
	font-size: 12px;
	text-align: center;
	color: var(--tm-muted);
}
.ip-footer a {
	color: var(--tm-muted);
}

/*==================================================
 * ozek zaslon
 * ===============================================*/
@media (max-width: 600px) {
	.ip-header-inner {
		flex-wrap: wrap;
		gap: 10px;
	}
	.ip-titles {
		flex-basis: 100%;
		order: 3;
	}
	.ip-lang {
		margin-left: auto;
	}
	.ip-card {
		padding: 14px 14px 18px 14px;
	}
}
