/* Gallery Viewer – full-screen view (html.rbgv-full) */

.img-box img { cursor: zoom-in; }

html.rbgv-full, html.rbgv-full body { overflow: hidden; }

html.rbgv-full .img-box {
	position: fixed; inset: 0; z-index: 100000;
	margin: 0; border: 0; background: #000;
	display: flex; flex-direction: column; align-items: center; justify-content: center;
}
/* Title directly above the image (as in the normal view) */
html.rbgv-full .img-box h3 {
	position: static; margin: 0; padding: 0 16px 10px;
	font-size: 16px; line-height: 1.3; color: #fff; text-align: center; background: none;
	pointer-events: none;
}
html.rbgv-full .img-box img {
	width: auto; height: auto;
	max-width: 100vw; max-height: calc(100vh - 80px); max-height: calc(100dvh - 80px);
	object-fit: contain; margin: 0 !important; cursor: default;
}
@media (min-width: 992px) {
	html.rbgv-full .img-box h3 { font-size: 20px; padding-bottom: 14px; }
	html.rbgv-full .img-box img { max-height: calc(100vh - 110px); max-height: calc(100dvh - 110px); }
}
/* Landscape phones: too little height – title as a subtle overlay at the top, image uses full height */
@media (orientation: landscape) and (max-height: 540px) {
	html.rbgv-full .img-box h3 {
		position: absolute; top: 0; left: 0; right: 0; z-index: 2;
		padding: calc(6px + env(safe-area-inset-top, 0px)) 64px 8px; font-size: 14px;
		background: linear-gradient(rgba(0,0,0,.6), rgba(0,0,0,0));
	}
	html.rbgv-full .img-box img { max-height: 100vh; max-height: 100dvh; }
}

/* Arrows: compact, inset from the edges and outside safe areas (notch, rounded corners, gesture zones) */
html.rbgv-full .img-box .arrowl,
html.rbgv-full .img-box .arrowr {
	position: fixed; top: 50%; bottom: auto; margin: 0; transform: translateY(-50%);
	width: 34px; height: 48px; z-index: 3; display: block !important;
}
html.rbgv-full .img-box .arrowl { left: calc(16px + env(safe-area-inset-left, 0px)); right: auto; }
html.rbgv-full .img-box .arrowr { right: calc(16px + env(safe-area-inset-right, 0px)); left: auto; }
html.rbgv-full .img-box .arrowl a,
html.rbgv-full .img-box .arrowr a,
html.rbgv-full .img-box .arrowl a:hover,
html.rbgv-full .img-box .arrowr a:hover {
	display: block; width: 34px; height: 48px; line-height: 46px; font-size: 22px;
	color: rgba(255,255,255,.9); background: rgba(0,0,0,.3); border-radius: 6px;
	text-align: center; text-decoration: none;
}
/* Landscape phones: rounded corners and system gesture zones need more room */
@media (orientation: landscape) and (max-height: 540px) {
	html.rbgv-full .img-box .arrowl { left: calc(28px + env(safe-area-inset-left, 0px)); }
	html.rbgv-full .img-box .arrowr { right: calc(28px + env(safe-area-inset-right, 0px)); }
}
@media (min-width: 992px) {
	html.rbgv-full .img-box .arrowl { left: 24px; }
	html.rbgv-full .img-box .arrowr { right: 24px; }
}

/* Hide the admin bar in full-screen view */
html.rbgv-full #wpadminbar { display: none; }

/* Hint toast */
.rbgv-hint {
	position: fixed; left: 50%; bottom: calc(18px + env(safe-area-inset-bottom, 0px)); transform: translateX(-50%);
	z-index: 100001; padding: 8px 16px; border-radius: 20px; max-width: 90vw; text-align: center;
	background: rgba(0,0,0,.7); color: #fff; font: 600 14px/1.3 sans-serif;
	pointer-events: none; opacity: 0; transition: opacity .3s ease;
}
.rbgv-hint.show { opacity: 1; }

.img-box img.rbgv-loading { opacity: .35; transition: opacity .15s ease; }


/* Photo info + counter + thumbnail strip (below the image) */
.rbgv-meta { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; margin: 12px 2px 0; font-size: 13px; color: #6e6e73; }
.rbgv-exif { letter-spacing: .02em; }
.rbgv-count { flex: none; font-size: 13px; letter-spacing: .06em; }
.rbgv-count strong { color: #1d1d1f; font-weight: 600; }
.rbgv-strip { margin: 12px 0 8px; }
.rbgv-strip ul {
	display: flex; gap: 6px; list-style: none; margin: 0; padding: 2px 2px 8px;
	overflow-x: auto; scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch; scrollbar-width: thin;
}
.rbgv-strip li { flex: none; scroll-snap-align: center; }
.rbgv-strip a { display: block; border-radius: 3px; overflow: hidden; outline-offset: 2px; }
.rbgv-strip img, .rbgv-noimg { display: block; width: 80px; height: 80px; object-fit: cover; background: #eee; opacity: .55; transition: opacity .2s; }
.rbgv-strip a:hover img, .rbgv-strip a:focus img { opacity: 1; }
.rbgv-strip li.is-current a { box-shadow: 0 0 0 2px #b3842f; }
.rbgv-strip li.is-current img { opacity: 1; }
@media (max-width: 767px) {
	.rbgv-meta { flex-direction: column-reverse; gap: 4px; font-size: 12px; margin-top: 10px; }
	.rbgv-strip img, .rbgv-noimg { width: 60px; height: 60px; }
}

/* Thumbnail strip in the full-screen view: hidden, so only the photo is visible.
   Shown via the small button at the bottom right (stays open until closed) or,
   with a mouse, while the pointer is at the bottom edge. It floats over the image. */
html { --rbgv-strip: 106px; }
html.rbgv-full .rbgv-strip {
	position: fixed; left: 0; right: 0; bottom: 0; z-index: 100001; margin: 0;
	padding: 24px calc(64px + env(safe-area-inset-right, 0px)) env(safe-area-inset-bottom, 0px) calc(12px + env(safe-area-inset-left, 0px));
	background: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,.8) 35%);
	box-sizing: border-box; transition: opacity .25s ease, transform .25s ease;
	opacity: 0; transform: translateY(60%); pointer-events: none;
}
html.rbgv-full.rbgv-strip-show .rbgv-strip { opacity: 1; transform: none; pointer-events: auto; }
html.rbgv-full .rbgv-strip ul { justify-content: safe center; scrollbar-color: #444 transparent; }
html.rbgv-full .rbgv-strip img { background: #222; opacity: .6; }
html.rbgv-full .rbgv-strip a:hover img, html.rbgv-full .rbgv-strip li.is-current img { opacity: 1; }
html.rbgv-full .rbgv-strip li.is-current a { box-shadow: 0 0 0 2px #d9a441; }
html.rbgv-full.rbgv-strip-show .rbgv-hint { bottom: calc(var(--rbgv-strip) + 14px + env(safe-area-inset-bottom, 0px)); }

.rbgv-strip-btn { display: none; }
html.rbgv-full .rbgv-strip-btn {
	display: flex; align-items: center; justify-content: center;
	position: fixed; z-index: 100002; width: 38px; height: 38px; padding: 0;
	right: calc(16px + env(safe-area-inset-right, 0px)); bottom: calc(16px + env(safe-area-inset-bottom, 0px));
	border: 0; border-radius: 6px; background: rgba(0,0,0,.35); color: rgba(255,255,255,.85); cursor: pointer;
}
html.rbgv-full .rbgv-strip-btn:hover { background: rgba(0,0,0,.55); color: #fff; }
html.rbgv-full.rbgv-strip-pinned .rbgv-strip-btn { color: #d9a441; }
@media (orientation: landscape) and (max-height: 540px) {
	html { --rbgv-strip: 80px; }
	html.rbgv-full .rbgv-strip { padding-top: 16px; }
	html.rbgv-full .rbgv-strip img { width: 60px; height: 60px; }
	html.rbgv-full .rbgv-strip-btn { right: calc(28px + env(safe-area-inset-right, 0px)); bottom: calc(12px + env(safe-area-inset-bottom, 0px)); }
}
@media (max-width: 767px) and (orientation: portrait) {
	html { --rbgv-strip: 84px; }
}

/* Location in the photo info line */
.rbgv-place a { color: inherit; text-decoration: none; border-bottom: 1px dotted rgba(0,0,0,.35); }
.rbgv-place a:hover { color: #8a6420; border-bottom-color: #b3842f; }
.rbgv-place svg { display: inline-block; vertical-align: -1px; margin-right: 3px; color: #b3842f; }