/* ASCD Facebook Feed 1.0.0 - everything is scoped under .ascd-fb */
.ascd-fb {
	--ascd-fb-text: #1c1e21;
	--ascd-fb-muted: #5b5f66;
	--ascd-fb-line: #dddfe2;
	--ascd-fb-bg: #fff;
	--ascd-fb-soft: #f0f2f5;
	--ascd-fb-accent: #0b5cd5;
	box-sizing: border-box;
	max-width: 720px;
	margin: 0 auto;
	font: 15px/1.45 -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	color: var(--ascd-fb-text);
}
.ascd-fb *,
.ascd-fb *::before,
.ascd-fb *::after { box-sizing: border-box; }
.ascd-fb--cols-2 { max-width: 1100px; }

.ascd-fb a { color: var(--ascd-fb-accent); text-decoration: none; }
.ascd-fb a:hover,
.ascd-fb a:focus-visible { text-decoration: underline; }
.ascd-fb a:focus-visible { outline: 2px solid var(--ascd-fb-accent); outline-offset: 2px; border-radius: 2px; }

.ascd-fb__note { margin: 0 0 12px; padding: 8px 12px; border-left: 4px solid #d98e04; background: #fff8e5; color: #5c4400; font-size: 13px; }
.ascd-fb__empty { margin: 0; padding: 16px; background: var(--ascd-fb-soft); border-radius: 8px; text-align: center; }

/* Page header */
.ascd-fb__pagehead { display: flex; align-items: center; gap: 12px; margin: 0 0 14px; padding: 12px 14px; background: var(--ascd-fb-bg); border: 1px solid var(--ascd-fb-line); border-radius: 8px; }
.ascd-fb__pagehead .ascd-fb__meta { flex: 1 1 auto; }
.ascd-fb__sub { display: block; font-size: 13px; color: var(--ascd-fb-muted); }
.ascd-fb__follow { flex: 0 0 auto; padding: 8px 14px; background: var(--ascd-fb-accent); color: #fff !important; border-radius: 6px; font-weight: 600; font-size: 14px; }
.ascd-fb__follow:hover { text-decoration: none !important; background: #0a4fb8; }

/* Cards */
.ascd-fb__list { display: grid; grid-template-columns: 1fr; gap: 16px; }
.ascd-fb--cols-2 .ascd-fb__list { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; }
.ascd-fb__card { background: var(--ascd-fb-bg); border: 1px solid var(--ascd-fb-line); border-radius: 8px; box-shadow: 0 1px 2px rgba(0, 0, 0, .08); overflow: hidden; }

.ascd-fb__head { display: flex; align-items: center; gap: 10px; padding: 12px 16px 4px; }
.ascd-fb__avatar { flex: 0 0 44px; width: 44px; height: 44px; border-radius: 50%; object-fit: cover; background: var(--ascd-fb-soft); display: block; }
.ascd-fb__avatar--blank { border: 1px solid var(--ascd-fb-line); }
.ascd-fb__meta { display: flex; flex-direction: column; min-width: 0; line-height: 1.25; }
.ascd-fb__name { font-weight: 600; color: var(--ascd-fb-text); }
.ascd-fb__date { font-size: 13px; color: var(--ascd-fb-muted) !important; }

.ascd-fb__text { padding: 8px 16px 12px; overflow-wrap: anywhere; }
.ascd-fb__text p { margin: 0 0 .7em; }
.ascd-fb__text p:last-child { margin-bottom: 0; }
.ascd-fb__readmore { font-weight: 600; }

/* Media */
.ascd-fb__media { background: var(--ascd-fb-soft); line-height: 0; }
.ascd-fb__media img { display: block; width: 100%; height: auto; }
.ascd-fb__photo img,
.ascd-fb__video img { max-height: 640px; object-fit: cover; }
.ascd-fb__photo,
.ascd-fb__video { display: block; position: relative; }

.ascd-fb__grid { display: grid; gap: 2px; }
.ascd-fb__grid--2 { grid-template-columns: 1fr 1fr; }
.ascd-fb__grid--3 { grid-template-columns: 1fr 1fr; }
.ascd-fb__grid--3 .ascd-fb__tile:first-child { grid-column: 1 / -1; }
.ascd-fb__grid--4 { grid-template-columns: 1fr 1fr; }
.ascd-fb .ascd-fb__tile { position: relative; display: block; aspect-ratio: 4 / 5 !important; overflow: hidden; background: var(--ascd-fb-soft); }
.ascd-fb .ascd-fb__grid--3 .ascd-fb__tile:first-child { aspect-ratio: 2 / 1 !important; }
.ascd-fb .ascd-fb__tile img { width: 100% !important; height: 100% !important; max-height: none !important; object-fit: cover; margin: 0 !important; display: block; }
.ascd-fb .ascd-fb__grid--land { grid-template-columns: 1fr; }
.ascd-fb .ascd-fb__grid--land .ascd-fb__tile { aspect-ratio: 16 / 9 !important; }
.ascd-fb__extra { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, .55); color: #fff; font: 600 34px/1 -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif; }

.ascd-fb__play { position: absolute; top: 50%; left: 50%; width: 64px; height: 64px; margin: -32px 0 0 -32px; border-radius: 50%; background: rgba(0, 0, 0, .65); border: 2px solid #fff; }
.ascd-fb__play::after { content: ""; position: absolute; top: 50%; left: 50%; margin: -11px 0 0 -7px; border-style: solid; border-width: 11px 0 11px 18px; border-color: transparent transparent transparent #fff; }

.ascd-fb__linkcard { display: block; line-height: 1.35; color: var(--ascd-fb-text) !important; }
.ascd-fb__linkcard:hover { text-decoration: none !important; }
.ascd-fb__linkmeta { display: block; padding: 10px 16px; background: var(--ascd-fb-soft); border-top: 1px solid var(--ascd-fb-line); }
.ascd-fb__host { display: block; font-size: 12px; text-transform: uppercase; letter-spacing: .03em; color: var(--ascd-fb-muted); }
.ascd-fb__linktitle { display: block; font-weight: 600; }

.ascd-fb .ascd-fb__foot { padding: 10px 16px; border-top: 1px solid var(--ascd-fb-line); font-size: 14px; background: #fff !important; color: #1c1e21 !important; }
.ascd-fb .ascd-fb__foot a { color: #1558b0 !important; text-decoration: underline; font-weight: 600; }
.ascd-fb__media + .ascd-fb__foot { border-top: 0; }
.ascd-fb__view { font-weight: 600; }

.ascd-fb__sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

@media (max-width: 782px) {
	.ascd-fb--cols-2 .ascd-fb__list { grid-template-columns: 1fr; }
}
@media (max-width: 480px) {
	.ascd-fb { font-size: 16px; }
	.ascd-fb__pagehead { flex-wrap: wrap; }
	.ascd-fb__follow { width: 100%; text-align: center; }
	.ascd-fb__card { border-radius: 0; border-left: 0; border-right: 0; }
	.ascd-fb__head { padding: 12px 12px 4px; }
	.ascd-fb__text,
	.ascd-fb__foot { padding-left: 12px; padding-right: 12px; }
	.ascd-fb__play { width: 52px; height: 52px; margin: -26px 0 0 -26px; }
}
