/* Physical Edge Instagram Feed — override the variables below to match the theme. */
.pe-ig {
	--pe-ig-accent: #0f4c5c;
	--pe-ig-text: inherit;
	--pe-ig-muted: rgba(0, 0, 0, .55);
	--pe-ig-gap: 8px;
	--pe-ig-radius: 10px;
	--pe-ig-overlay: rgba(10, 30, 40, .72);
	--pe-ig-cols: 4;
	font: inherit;
	color: var(--pe-ig-text);
	margin: 0 auto;
	max-width: 1280px;
}
.pe-ig *, .pe-ig *::before, .pe-ig *::after { box-sizing: border-box; }

/* Header */
.pe-ig__header { display: flex; align-items: center; gap: 12px; margin-bottom: 16px; }
.pe-ig__avatar { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; flex: none; }
.pe-ig__who { display: flex; flex-direction: column; min-width: 0; }
.pe-ig__title { font-weight: 600; font-size: 1.1em; line-height: 1.2; }
.pe-ig__handle { color: var(--pe-ig-muted); font-size: .9em; }
.pe-ig__follow {
	margin-left: auto; padding: 9px 20px; border-radius: 999px;
	background: var(--pe-ig-accent); color: #fff !important; text-decoration: none !important;
	font-weight: 600; font-size: .9em; transition: opacity .2s;
}
.pe-ig__follow:hover { opacity: .85; }

/* Track */
.pe-ig__viewport { position: relative; }
.pe-ig__track { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--pe-ig-gap); }
.pe-ig__item { margin: 0; padding: 0; }

.pe-ig--grid .pe-ig__track { grid-template-columns: repeat(var(--pe-ig-cols), minmax(0, 1fr)); }

.pe-ig--slider .pe-ig__track {
	grid-auto-flow: column;
	grid-auto-columns: calc((100% - (var(--pe-ig-cols) - 1) * var(--pe-ig-gap)) / var(--pe-ig-cols));
	overflow-x: auto; scroll-snap-type: x mandatory; scroll-behavior: smooth;
	scrollbar-width: none; -webkit-overflow-scrolling: touch;
}
.pe-ig--slider .pe-ig__track::-webkit-scrollbar { display: none; }
.pe-ig--slider[data-slider-rows] .pe-ig__track { grid-template-rows: repeat(var(--pe-ig-rows, 1), auto); }
.pe-ig--slider .pe-ig__item { scroll-snap-align: start; }

/* Tile */
.pe-ig__tile {
	position: relative; display: block; aspect-ratio: 1 / 1; overflow: hidden;
	border-radius: var(--pe-ig-radius); background: #e9eef0; color: #fff; text-decoration: none;
}
.pe-ig__tile img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s ease; }
.pe-ig__tile:hover img, .pe-ig__tile:focus-visible img { transform: scale(1.06); }
.pe-ig__tile:focus-visible { outline: 3px solid var(--pe-ig-accent); outline-offset: 2px; }

.pe-ig__overlay {
	position: absolute; inset: 0; display: flex; flex-wrap: wrap; align-content: center; justify-content: center;
	gap: 6px 18px; padding: 16px; text-align: center; background: var(--pe-ig-overlay);
	opacity: 0; transition: opacity .25s; font-size: .9em;
}
.pe-ig__tile:hover .pe-ig__overlay, .pe-ig__tile:focus-visible .pe-ig__overlay { opacity: 1; }
.pe-ig__stat { font-weight: 600; display: inline-flex; align-items: center; gap: 6px; }
.pe-ig__stat::before { content: ""; width: 16px; height: 16px; background: currentColor; -webkit-mask: var(--i) center/contain no-repeat; mask: var(--i) center/contain no-repeat; }
.pe-ig__stat--likes { --i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21s-7.5-4.6-10-9.3C.3 8.3 2.4 4 6.3 4c2.2 0 3.6 1.2 4.7 2.6C12.1 5.2 13.5 4 15.7 4 19.6 4 21.7 8.3 22 11.7 19.5 16.4 12 21 12 21z'/%3E%3C/svg%3E"); }
.pe-ig__stat--comments { --i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3C6.5 3 2 6.9 2 11.6c0 2.4 1.2 4.6 3.1 6.2L4 22l4.6-2.4c1.1.3 2.2.5 3.4.5 5.5 0 10-3.9 10-8.5S17.5 3 12 3z'/%3E%3C/svg%3E"); }
.pe-ig__snippet { flex-basis: 100%; line-height: 1.35; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }

.pe-ig__badge { position: absolute; top: 10px; right: 10px; width: 20px; height: 20px; background: #fff; filter: drop-shadow(0 1px 2px rgba(0,0,0,.5)); -webkit-mask: var(--i) center/contain no-repeat; mask: var(--i) center/contain no-repeat; }
.pe-ig__badge--video { --i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 4v16l13-8z'/%3E%3C/svg%3E"); }
.pe-ig__badge--album { --i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M8 2h12a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H8a2 2 0 0 1-2-2V4a2 2 0 0 1 2-2zM2 7v13a2 2 0 0 0 2 2h13v-2H4V7z'/%3E%3C/svg%3E"); }

/* Slider arrows */
.pe-ig__arrow {
	position: absolute; top: 50%; z-index: 2; width: 42px; height: 42px; margin-top: -21px;
	border: 0; border-radius: 50%; background: #fff; color: #111; font-size: 28px; line-height: 40px;
	box-shadow: 0 2px 10px rgba(0,0,0,.2); cursor: pointer; transition: opacity .2s, transform .2s; padding: 0;
}
.pe-ig__arrow:hover { transform: scale(1.08); }
.pe-ig__arrow[disabled] { opacity: 0; pointer-events: none; }
.pe-ig__arrow--prev { left: -14px; }
.pe-ig__arrow--next { right: -14px; }

/* Responsive columns (set per feed via --pe-ig-cols-t / --pe-ig-cols-m) */
@media (max-width: 1024px) { .pe-ig .pe-ig__track { --pe-ig-cols: var(--pe-ig-cols-t, 3); } }
@media (max-width: 640px) {
	.pe-ig .pe-ig__track { --pe-ig-cols: var(--pe-ig-cols-m, 2); }
	.pe-ig--slider .pe-ig__track { grid-auto-columns: 72%; }
	.pe-ig__arrow { display: none; }
	.pe-ig__overlay { display: none; }
}

/* Card style (Instagram-like) */
.pe-ig--cards { --pe-ig-card-bg: #fff; --pe-ig-card-border: #e5e5e5; --pe-ig-card-text: #111; --pe-ig-card-muted: #737373; }
.pe-ig--cards .pe-ig__track { align-items: stretch; }
.pe-ig--cards .pe-ig__item { display: flex; min-width: 0; }
.pe-ig__card {
	display: flex; flex-direction: column; width: 100%; background: var(--pe-ig-card-bg); color: var(--pe-ig-card-text);
	box-shadow: 0 0 0 1px var(--pe-ig-card-border); cursor: pointer; font-size: 14px; line-height: 1.4; text-align: left;
}
.pe-ig--cards[style*="--pe-ig-gap:0px"] .pe-ig__card { box-shadow: 0 0 0 .5px var(--pe-ig-card-border); }
.pe-ig:not([style*="--pe-ig-gap:0px"]) .pe-ig__card { border-radius: var(--pe-ig-radius); overflow: hidden; }
.pe-ig__card-head { display: flex; align-items: center; gap: 10px; padding: 12px 14px; min-width: 0; }
.pe-ig__card-avatar { width: 36px; height: 36px; border-radius: 50%; object-fit: cover; flex: none; }
.pe-ig__card-name { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; }
.pe-ig__card-ig { margin-left: auto; flex: none; width: 18px; height: 18px; background: var(--pe-ig-card-text); -webkit-mask: var(--i) center/contain no-repeat; mask: var(--i) center/contain no-repeat;
	--i: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2.2c3.2 0 3.6 0 4.8.1 3.3.1 4.8 1.7 4.9 4.9.1 1.3.1 1.6.1 4.8s0 3.6-.1 4.8c-.1 3.2-1.7 4.8-4.9 4.9-1.3.1-1.6.1-4.8.1s-3.6 0-4.8-.1c-3.3-.1-4.8-1.7-4.9-4.9C2.2 15.6 2.2 15.2 2.2 12s0-3.6.1-4.8C2.4 3.9 3.9 2.4 7.2 2.3 8.4 2.2 8.8 2.2 12 2.2zM12 0C8.7 0 8.3 0 7.1.1 2.7.3.3 2.7.1 7.1 0 8.3 0 8.7 0 12s0 3.7.1 4.9c.2 4.4 2.6 6.8 7 7 1.2.1 1.6.1 4.9.1s3.7 0 4.9-.1c4.4-.2 6.8-2.6 7-7 .1-1.2.1-1.6.1-4.9s0-3.7-.1-4.9c-.2-4.4-2.6-6.8-7-7C15.7 0 15.3 0 12 0zm0 5.8a6.2 6.2 0 1 0 0 12.4 6.2 6.2 0 0 0 0-12.4zM12 16a4 4 0 1 1 0-8 4 4 0 0 1 0 8zm6.4-11.8a1.4 1.4 0 1 0 0 2.9 1.4 1.4 0 0 0 0-2.9z'/%3E%3C/svg%3E"); }
.pe-ig--cards .pe-ig__tile { border-radius: 0; }
.pe-ig--cards .pe-ig__tile:hover img { transform: none; }
.pe-ig__card:hover .pe-ig__tile img { opacity: .92; }
.pe-ig__card-body { padding: 12px 14px 16px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.pe-ig__card-actions { display: flex; gap: 16px; font-weight: 600; }
.pe-ig__card-actions .pe-ig__stat::before { width: 18px; height: 18px; }
.pe-ig__card-text { margin: 0; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; word-break: break-word; }
.pe-ig__card-date { margin-top: auto; color: var(--pe-ig-card-muted); font-size: 12px; }
.pe-ig__card:focus-within { outline: 2px solid var(--pe-ig-accent); outline-offset: -2px; }

/* Load more */
.pe-ig__item[hidden] { display: none !important; }
.pe-ig__more-wrap { text-align: center; margin-top: 24px; }
.pe-ig__more {
	border: 0; border-radius: 8px; padding: 12px 28px; cursor: pointer; font: inherit; font-weight: 600;
	background: var(--pe-ig-more-bg, #4a5ef9); color: var(--pe-ig-more-text, #fff); transition: filter .2s;
}
.pe-ig__more:hover { filter: brightness(1.08); }
.pe-ig__more[hidden] { display: none; }

/* Lightbox */
.pe-ig-lb {
	border: 0; padding: 0; margin: auto; width: min(1000px, 94vw); max-height: 92vh;
	background: #fff; color: #1a1a1a; border-radius: 12px; overflow: hidden;
}
.pe-ig-lb::backdrop { background: rgba(0, 0, 0, .82); }
.pe-ig-lb__inner { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(280px, 1fr); max-height: 92vh; }
.pe-ig-lb__media { position: relative; background: #000; display: flex; align-items: center; justify-content: center; min-height: 320px; }
.pe-ig-lb__media img, .pe-ig-lb__media video { max-width: 100%; max-height: 92vh; display: block; object-fit: contain; }
.pe-ig-lb__side { display: flex; flex-direction: column; min-height: 0; }
.pe-ig-lb__head { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-bottom: 1px solid #eee; font-weight: 600; }
.pe-ig-lb__head img { width: 32px; height: 32px; border-radius: 50%; }
.pe-ig-lb__caption { padding: 16px; overflow-y: auto; white-space: pre-line; line-height: 1.5; font-size: .95em; flex: 1; }
.pe-ig-lb__foot { padding: 12px 16px; border-top: 1px solid #eee; display: flex; align-items: center; gap: 16px; font-size: .9em; color: #555; }
.pe-ig-lb__foot a { margin-left: auto; color: var(--pe-ig-accent, #0f4c5c); font-weight: 600; text-decoration: none; }
.pe-ig-lb__close, .pe-ig-lb__nav, .pe-ig-lb__slide {
	position: absolute; border: 0; cursor: pointer; color: #fff; background: rgba(0,0,0,.45);
	border-radius: 50%; width: 38px; height: 38px; font-size: 24px; line-height: 36px; padding: 0;
}
.pe-ig-lb__close { position: fixed; top: 14px; right: 14px; font-size: 26px; }
.pe-ig-lb__nav { position: fixed; top: 50%; margin-top: -19px; }
.pe-ig-lb__nav--prev { left: 14px; }
.pe-ig-lb__nav--next { right: 14px; }
.pe-ig-lb__slide { top: 50%; margin-top: -19px; background: rgba(255,255,255,.85); color: #111; }
.pe-ig-lb__slide--prev { left: 10px; }
.pe-ig-lb__slide--next { right: 10px; }
.pe-ig-lb__dots { position: absolute; bottom: 12px; left: 0; right: 0; display: flex; justify-content: center; gap: 6px; }
.pe-ig-lb__dots span { width: 6px; height: 6px; border-radius: 50%; background: rgba(255,255,255,.45); }
.pe-ig-lb__dots span.is-on { background: #fff; }
@media (max-width: 760px) {
	.pe-ig-lb { width: 100vw; max-height: 100vh; height: 100%; border-radius: 0; }
	.pe-ig-lb__inner { grid-template-columns: 1fr; max-height: 100vh; overflow-y: auto; }
	.pe-ig-lb__media img, .pe-ig-lb__media video { max-height: 70vh; }
	.pe-ig-lb__nav { display: none; }
}
