/* =========================================================
   kladOS Feed Post Styling
   ========================================================= */

/* ---------- Base card ---------- */

/* ---------- Structured system posts ---------- */

.klad-feed-post-content {
	width:100%;
	max-width:100%;
	box-sizing:border-box;
	overflow-x:auto;
}

.klad-feed-post-content table {
	max-width:100%;
}

.klad-feed-post-content .mediumtitle {
	color:rgba(76,111,43,1);
	font:bold 14px Tahoma, "Lucida Grande", "Trebuchet MS", Helvetica, sans-serif;
}

.klad-feed-post-content .itemtitle {
	color:rgba(76,111,43,1);
	font-family:Tahoma, "Lucida Grande", "Trebuchet MS", Helvetica, sans-serif;
	font-size:1.1rem;
	cursor:default;
}

.klad-feed-post-content .datarow {
	padding-right:0.2rem;
	padding-left:0.2rem;
	border-bottom:1px solid rgba(200,200,200,0.4);
	line-height:28px;
	vertical-align:top;
}

.klad-feed-post-content .formbttn {
	padding:0.2rem;
	border:1px solid gray;
	border-radius:5px;
	background-color:rgba(255,255,255,1);
	color:#000000;
	font-family:Tahoma, "Lucida Grande", "Trebuchet MS", Helvetica, sans-serif;
	font-size:1rem;
	cursor:pointer;
}

.klad-feed-post-content .formbttn:hover {
	background-color:rgba(204,221,119,0.55);
	box-shadow:0 0 2px hsla(0,0%,0%,1);
}

.klad-feed-post-map {
	width:100%;
	height:350px;
	margin:0 0 16px;
	border-bottom:1px solid #c8ced3;
	background:#eef2f3;
}

.pn-feed-card.is-system-post .pn-observation-media,
.pn-feed-card.is-system-post .pn-observation-meta {
	display:none !important;
}

.pn-feed-card.is-system-post .pn-card-heading {
	padding-bottom:0;
}

.pn-feed-card.is-system-post .pn-card-caption {
	padding-top:10px;
}

.klad-feed-post-map.is-unavailable {
	display:flex;
	align-items:center;
	justify-content:center;
	color:#5f666b;
}

.pn-atmotube-legend {
	min-width:170px;
	padding:9px;
	border:1px solid #ccc;
	border-radius:8px;
	background:rgba(255,255,255,0.95);
	box-shadow:0 2px 8px rgba(0,0,0,0.15);
	font-size:12px;
}

.pn-atmotube-legend strong,
.pn-atmotube-legend span {
	display:block;
}

.pn-atmotube-legend span {
	margin-top:4px;
}

.pn-atmotube-legend i {
	display:inline-block;
	width:13px;
	height:13px;
	margin-right:7px;
	border:1px solid #999;
	vertical-align:-2px;
}

.klad-feed-card {
	margin:20px auto 0 auto;
	width:calc(100% - 40px);
	max-width:none;
	padding:20px;
	border-radius:14px;
	text-align:left;
	font-family:Arial, Helvetica, sans-serif;
	line-height:1.6;
	box-sizing:border-box;
	overflow:hidden;
}

/* ---------- Themes ---------- */

.klad-feed-card.klad-feed-light {
	background:linear-gradient(145deg,#eef8f1,#d9efe2);
	color:#173b2f;
	border:1px solid rgba(70,130,100,0.25);
	border-radius:5px;
	box-shadow:none;
}

.klad-feed-card.klad-feed-earth {
	background:linear-gradient(145deg,#f3efe4,#e3d8bf);
	color:#3b2d1f;
	border:1px solid rgba(120,90,45,0.25);
	box-shadow:0 6px 24px rgba(80,60,30,0.22);
}

.klad-feed-card.klad-feed-dark {
	background:linear-gradient(145deg,#10231d,#07110e);
	color:#d9fff0;
	border:1px solid rgba(180,255,220,0.18);
	box-shadow:0 6px 24px rgba(0,0,0,0.35);
}

/* ---------- Images ---------- */

.klad-feed-image-box {
	text-align:center;
	margin-bottom:18px;
}

.klad-feed-image {
	max-width:520px;
	width:85%;
	border-radius:12px;
	box-shadow:0 4px 18px rgba(30,80,60,0.25);
}

.klad-feed-card.klad-feed-light .klad-feed-image {
	border:1px solid rgba(70,130,100,0.25);
	border-radius:5px;
	box-shadow:none;
}

/* ---------- Titles ---------- */

.klad-feed-title {
	margin-top:0;
	margin-bottom:12px;
	text-align:center;
	font-size:1.45em;
	line-height:1.3;
}

.klad-feed-subtitle {
	margin-top:-4px;
	margin-bottom:18px;
	text-align:center;
	font-size:1.05em;
	font-weight:normal;
	opacity:0.85;
}

.klad-feed-section-title {
	margin-top:24px;
	margin-bottom:10px;
	padding-bottom:6px;
	font-size:1.15em;
	line-height:1.3;
}

/* ---------- Paragraphs ---------- */

.klad-feed-card p {
	margin:0 0 14px 0;
}

.klad-feed-section {
	margin-top:18px;
}

/* ---------- Links ---------- */

.klad-feed-link-box {
	text-align:center;
	margin:0 0 22px 0;
}

.klad-feed-link,
.klad-feed-button {
	font-weight:bold;
	text-decoration:none;
}

.klad-feed-link:hover,
.klad-feed-button:hover {
	text-decoration:underline;
}

/* ---------- Quote ---------- */

.klad-feed-quote {
	margin:18px 0;
	padding:14px 18px;
	border-radius:8px;
	font-style:normal;
}

/* ---------- Highlight / alert ---------- */

.klad-feed-highlight {
	margin:18px 0;
	padding:14px 18px;
	border-radius:8px;
	font-weight:normal;
}

.klad-feed-alert {
	margin:18px 0;
	padding:14px 18px;
	border-radius:8px;
	font-weight:bold;
}

/* ---------- Reference ---------- */

.klad-feed-reference {
	font-size:0.9em;
	margin-top:22px;
	opacity:0.85;
}

/* ---------- Tags ---------- */

.klad-feed-tag-list {
	margin-top:18px;
}

.klad-feed-tag {
	display:inline-block;
	margin:3px 5px 3px 0;
	padding:4px 9px;
	border-radius:999px;
	font-size:0.85em;
}

/* ---------- Columns ---------- */

.klad-feed-columns {
	display:flex;
	gap:14px;
	margin:18px 0;
}

.klad-feed-column {
	flex:1;
	padding:14px;
	border-radius:10px;
	box-sizing:border-box;
}

/* ---------- Button ---------- */

.klad-feed-button {
	display:inline-block;
	margin-top:8px;
	padding:8px 14px;
	border-radius:999px;
}

/* ---------- Divider ---------- */

.klad-feed-divider {
	height:1px;
	margin:22px 0;
}

/* =========================================================
   Theme-specific child colors
   ========================================================= */

/* ---------- Light theme ---------- */

.klad-feed-light .klad-feed-title,
.klad-feed-light .klad-feed-section-title {
	color:#0f4a38;
}

.klad-feed-light .klad-feed-section-title {
	border-bottom:1px solid rgba(47,143,107,0.35);
}

.klad-feed-light .klad-feed-link,
.klad-feed-light .klad-feed-button {
	color:#1b7358;
}

.klad-feed-light .klad-feed-quote {
	border-left:4px solid #2f8f6b;
	background:rgba(255,255,255,0.65);
	color:#244238;
}

.klad-feed-light .klad-feed-highlight {
	background:rgba(255,255,255,0.7);
	border-left:4px solid #4da77d;
	color:#173b2f;
}

.klad-feed-light .klad-feed-alert {
	background:#fff4d6;
	border-left:4px solid #c8942f;
	color:#5a3d10;
}

.klad-feed-light .klad-feed-reference {
	color:#46675d;
}

.klad-feed-light .klad-feed-tag {
	background:rgba(47,143,107,0.14);
	color:#0f4a38;
}

.klad-feed-light .klad-feed-column {
	background:rgba(255,255,255,0.55);
}

.klad-feed-light .klad-feed-divider {
	background:rgba(47,143,107,0.3);
}

/* ---------- Earth theme ---------- */

.klad-feed-earth .klad-feed-title,
.klad-feed-earth .klad-feed-section-title {
	color:#5c3f1f;
}

.klad-feed-earth .klad-feed-section-title {
	border-bottom:1px solid rgba(120,90,45,0.35);
}

.klad-feed-earth .klad-feed-link,
.klad-feed-earth .klad-feed-button {
	color:#7b5527;
}

.klad-feed-earth .klad-feed-quote {
	border-left:4px solid #9b7a42;
	background:rgba(255,255,255,0.55);
	color:#3b2d1f;
}

.klad-feed-earth .klad-feed-highlight {
	background:rgba(255,255,255,0.6);
	border-left:4px solid #8b6d36;
	color:#3b2d1f;
}

.klad-feed-earth .klad-feed-alert {
	background:#fff1c9;
	border-left:4px solid #b17c22;
	color:#5a3d10;
}

.klad-feed-earth .klad-feed-reference {
	color:#6b5a43;
}

.klad-feed-earth .klad-feed-tag {
	background:rgba(120,90,45,0.14);
	color:#5c3f1f;
}

.klad-feed-earth .klad-feed-column {
	background:rgba(255,255,255,0.45);
}

.klad-feed-earth .klad-feed-divider {
	background:rgba(120,90,45,0.3);
}

/* ---------- Dark theme ---------- */

.klad-feed-dark .klad-feed-title,
.klad-feed-dark .klad-feed-section-title {
	color:#b8ffe3;
}

.klad-feed-dark .klad-feed-section-title {
	border-bottom:1px solid rgba(184,255,227,0.35);
}

.klad-feed-dark .klad-feed-link,
.klad-feed-dark .klad-feed-button {
	color:#8debc9;
}

.klad-feed-dark .klad-feed-quote {
	border-left:4px solid #8debc9;
	background:rgba(255,255,255,0.07);
	color:#ffffff;
}

.klad-feed-dark .klad-feed-highlight {
	background:rgba(255,255,255,0.08);
	border-left:4px solid #8debc9;
	color:#eafff6;
}

.klad-feed-dark .klad-feed-alert {
	background:rgba(255,210,120,0.14);
	border-left:4px solid #ffc857;
	color:#ffe8b8;
}

.klad-feed-dark .klad-feed-reference {
	color:rgba(217,255,240,0.78);
}

.klad-feed-dark .klad-feed-tag {
	background:rgba(141,235,201,0.14);
	color:#b8ffe3;
}

.klad-feed-dark .klad-feed-column {
	background:rgba(255,255,255,0.07);
}

.klad-feed-dark .klad-feed-divider {
	background:rgba(184,255,227,0.25);
}

/* ---------- Responsive ---------- */

@media (max-width:700px) {
	.klad-feed-post-map {
		height:280px;
	}

	.klad-feed-card {
		width:calc(100% - 40px);
		padding:16px;
	}

	.klad-feed-image {
		width:100%;
	}

	.klad-feed-columns {
		display:block;
	}

	.klad-feed-column {
		margin-bottom:12px;
	}
}

.klad-img-soft {
	border-radius:12px;
	box-shadow:0 4px 18px rgba(30,80,60,0.25);
}

.klad-img-border {
	border:1px solid rgba(70,130,100,0.35);
	border-radius:12px;
}

.klad-img-frame {
	border:6px solid #eef8f1;
	border-radius:12px;
	box-shadow:0 4px 18px rgba(30,80,60,0.25);
}

.klad-img-round {
	border-radius:50%;
}

.klad-img-plain {
	border-radius:0;
	box-shadow:none;
	border:none;
}