/*
|--------------------------------------------------------------------------
| Upload Preview
|--------------------------------------------------------------------------
*/

.petdoost-review-image-help {
	display: block;
	margin-top: 8px;
	font-size: 12px;
	opacity: 0.7;
}


.petdoost-review-image-preview {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 10px;
}


.petdoost-review-image-preview img {
	display: block;
	width: 80px;
	height: 80px;
	object-fit: cover;
	border-radius: 8px;
}


/*
|--------------------------------------------------------------------------
| Review Gallery
|--------------------------------------------------------------------------
*/

.petdoost-review-gallery {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 15px;
}


.petdoost-review-gallery-item {
	display: block;
	width: 100px;
	height: 100px;
	overflow: hidden;
	border-radius: 8px;
	cursor: pointer;
}


.petdoost-review-gallery-item img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: opacity 0.2s ease;
}


.petdoost-review-gallery-item:hover img {
	opacity: 0.8;
}


/*
|--------------------------------------------------------------------------
| Lightbox
|--------------------------------------------------------------------------
*/

.petdoost-lightbox {
	position: fixed;
	z-index: 999999;
	inset: 0;

	display: none;

	align-items: center;
	justify-content: center;

	padding: 30px;

	background: rgba(0, 0, 0, 0.9);
}


.petdoost-lightbox.active {
	display: flex;
}


.petdoost-lightbox img {
	display: block;

	max-width: 90vw;
	max-height: 85vh;

	width: auto;
	height: auto;

	object-fit: contain;
}


/*
|--------------------------------------------------------------------------
| Lightbox Buttons
|--------------------------------------------------------------------------
*/

.petdoost-lightbox-close,
.petdoost-lightbox-prev,
.petdoost-lightbox-next {

	position: absolute;

	width: 45px;
	height: 45px;

	border: 0;
	border-radius: 50%;

	background: rgba(255, 255, 255, 0.15);

	color: #fff;

	cursor: pointer;

	font-size: 25px;
	line-height: 45px;

	text-align: center;

}


.petdoost-lightbox-close {
	top: 20px;
	right: 20px;
}


.petdoost-lightbox-prev {
	right: 20px;
	top: 50%;

	transform: translateY(-50%);
}


.petdoost-lightbox-next {
	left: 20px;
	top: 50%;

	transform: translateY(-50%);
}


.petdoost-lightbox-close:hover,
.petdoost-lightbox-prev:hover,
.petdoost-lightbox-next:hover {

	background: rgba(255, 255, 255, 0.3);

}
.petdoost-review-column { min-width: 0; }
.petdoost-buyer-images { margin: 0 0 24px; padding: 4px 0 22px; border-bottom: 1px solid var(--tw-border, #e5e7eb); }
.petdoost-buyer-images[hidden], .petdoost-buyer-images [hidden] { display: none !important; }
.petdoost-buyer-images h3 { margin: 0 0 20px; font: inherit; font-size: 18px; font-weight: 700; }
.petdoost-buyer-images-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 90px)); justify-content: space-between; gap: clamp(8px, 2vw, 24px); }
.petdoost-buyer-images .petdoost-review-gallery-item { width: 100%; height: auto; aspect-ratio: 1; max-width: 90px; border: 1px solid var(--tw-border, #e5e7eb); border-radius: 16px; box-sizing: border-box; }
.petdoost-buyer-images:not(.is-expanded) .petdoost-review-gallery-item:nth-child(n+7) { display: none; }
.petdoost-buyer-images-more { display: flex; align-items: center; gap: 10px; margin: 20px 0 0; padding: 4px 0; border: 0; background: transparent; color: #1674ef; font: inherit; font-weight: 700; cursor: pointer; }
.petdoost-buyer-images-more:disabled { opacity: .6; cursor: wait; }
.petdoost-buyer-images-status { font-size: 12px; margin: 8px 0 0; }
.petdoost-buyer-images-status:empty { display: none; }
.petdoost-buyer-images :is(a, button):focus-visible { outline: 2px solid #1674ef; outline-offset: 4px; }
@media (max-width: 480px) {
	.petdoost-buyer-images-grid { grid-template-columns: repeat(3, minmax(0, 90px)); gap: 12px; }
}

.petdoost-admin-review-images { margin-top: 10px; }
.petdoost-admin-review-images .petdoost-review-gallery { margin: 8px 0; gap: 8px; }
.petdoost-admin-review-images .petdoost-review-gallery-item { width: 64px; height: 64px; }
.petdoost-admin-image-unavailable { font-size: 12px; color: #646970; }


/* Review details dialog: scoped to this plugin, including in wp-admin. */
dialog.petdoost-lightbox { position:fixed; inset:0; margin:auto; padding:0; width:min(720px, calc(100vw - 32px)); max-width:720px; max-height:calc(100dvh - 32px); border:0; border-radius:16px; background:#fff; color:#252525; font-family:inherit; box-shadow:0 20px 80px #0004; overflow:hidden; box-sizing:border-box; }
dialog.petdoost-lightbox:not([open]) { display:none; }
dialog.petdoost-lightbox[open] { display:flex; flex-direction:column; align-items:stretch; justify-content:flex-start; }
dialog.petdoost-lightbox::backdrop { background:rgba(0,0,0,.65); }
.petdoost-lightbox [hidden] { display:none !important; }
.petdoost-lightbox-header { display:flex; justify-content:space-between; align-items:center; padding:18px 24px 10px; flex-shrink:0; }
.petdoost-lightbox-header h2 { margin:0; color:#202020; font-size:23px; font-weight:700; line-height:1.5; }
.petdoost-lightbox-body { overflow-y:auto; overscroll-behavior:contain; min-height:0; padding:8px 24px 16px; }
.petdoost-lightbox .petdoost-lightbox-image { display:block; width:100%; height:auto; max-width:100%; max-height:48dvh; object-fit:contain; border-radius:9px; margin:0 auto 16px; }
.petdoost-lightbox-meta { display:flex; align-items:center; flex-wrap:wrap; gap:10px; color:#777; font-size:14px; margin:12px 0; }
.petdoost-lightbox-author { overflow-wrap:anywhere; }
.petdoost-lightbox-buyer { color:#d65c38; background:#fff3ee; border-radius:6px; padding:4px 9px; }
.petdoost-lightbox-date { margin-inline-start:auto; font-size:13px; }
.petdoost-lightbox-text { position:relative; white-space:pre-wrap; overflow-wrap:anywhere; line-height:1.9; font-size:16px; color:#616161; max-height:7.6em; overflow:hidden; }
.petdoost-lightbox-text.is-truncated:not(.is-expanded) { mask-image:linear-gradient(#000 45%,transparent); }
.petdoost-lightbox-text.is-expanded { max-height:none; overflow:visible; mask-image:none; }
.petdoost-lightbox .petdoost-lightbox-more { display:block; margin:14px auto 0; padding:5px 12px; border:0; background:transparent; color:#d65c38; font:inherit; font-weight:600; cursor:pointer; }
.petdoost-lightbox-footer { display:flex; align-items:center; justify-content:flex-end; gap:10px; padding:12px 24px 18px; flex-shrink:0; border-top:1px solid #f1f1f1; }
.petdoost-lightbox-count { margin-inline-end:auto; color:#777; font-size:13px; }
.petdoost-lightbox .petdoost-lightbox-close, .petdoost-lightbox .petdoost-lightbox-prev, .petdoost-lightbox .petdoost-lightbox-next { position:static; inset:auto; transform:none; width:42px; height:42px; border:1px solid #ddd; border-radius:9px; color:#333; background:#f7f7f7; font-size:28px; line-height:1; cursor:pointer; }
.petdoost-lightbox .petdoost-lightbox-close { background:transparent; color:#888; border:0; font-size:32px; }
.petdoost-lightbox button:hover { color:#d65c38; }
.petdoost-lightbox button:disabled { opacity:.35; cursor:default; }
.petdoost-lightbox button:focus-visible { outline:2px solid #d65c38; outline-offset:2px; }
.petdoost-lightbox-image-status { color:#d65c38; font-size:13px; }
.petdoost-lightbox-image-status:empty { display:none; }
.petdoost-buyer-images .petdoost-review-summary { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:8px 0; margin:0 0 20px; }
.petdoost-review-summary a { display:inline-flex; align-items:center; gap:6px; padding-inline:10px; color:var(--tw-muted,#777); font-size:12px; line-height:1.8; text-decoration:none; white-space:nowrap; }
.petdoost-review-summary a + a { border-inline-start:1px solid var(--tw-border,#e5e7eb); }
.petdoost-review-summary svg { width:20px; height:20px; flex-shrink:0; fill:none; stroke:currentColor; stroke-width:1.7; }
.petdoost-review-summary .tw-review-summary-star { fill:#ff9136; stroke:#ff9136; }
.petdoost-review-summary a:hover { color:var(--tw-text,#333); }
.petdoost-buyer-images .petdoost-buyer-images-more { color:#d65c38; }
.petdoost-buyer-images :is(a,button):focus-visible { outline-color:#d65c38; }
@media(max-width:480px) {
 dialog.petdoost-lightbox { width:calc(100vw - 16px); max-height:calc(100dvh - 16px); border-radius:12px; }
 .petdoost-lightbox-header { padding:12px 16px 6px; }
 .petdoost-lightbox-body { padding:6px 16px 12px; }
 .petdoost-lightbox-footer { padding:10px 16px 14px; }
 .petdoost-lightbox-header h2 { font-size:20px; }
 .petdoost-lightbox-text { font-size:15px; }
}
.review-images-video-item, .review-images-video-tile { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; background:#fff3ee; color:#d65c38; text-decoration:none; }
.review-images-video-tile { width:100%; height:100%; min-height:60px; font-size:16px; }
.review-images-video-item > span, .review-images-video-tile > span { font-size:28px; }
.review-images-video-item small, .review-images-video-tile small { font-size:11px; }
.petdoost-lightbox .review-images-lightbox-video { display:block; width:100%; height:min(48dvh,480px); max-width:100%; object-fit:contain; background:#111; border-radius:9px; margin:0 auto 16px; }
#review-images-video-preview video { display:block; width:100%; max-width:360px; max-height:240px; object-fit:contain; background:#111; border-radius:8px; margin-top:10px; }
.review-images-video-count { align-self:center; font-size:12px; }
/* Presentation only: WordPress Discussion settings control review pagination. */
#reviews .tw-review-list .pagination { margin-block:24px 8px; }
#reviews .tw-review-list .pagination .nav-links { display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:8px; }
#reviews .tw-review-list .pagination .page-numbers { display:inline-flex; align-items:center; justify-content:center; min-width:38px; min-height:38px; padding:6px 12px; box-sizing:border-box; border:1px solid var(--tw-border,#e5e7eb); border-radius:8px; background:var(--tw-surface,#fff); color:var(--tw-text,#333); font:inherit; font-size:13px; line-height:1.5; text-decoration:none; }
#reviews .tw-review-list .pagination a.page-numbers:hover { border-color:#d65c38; color:#d65c38; background:#fff3ee; }
#reviews .tw-review-list .pagination .page-numbers.current { color:#fff; background:#d65c38; border-color:#d65c38; font-weight:700; }
#reviews .tw-review-list .pagination .page-numbers.dots { border-color:transparent; background:transparent; }
#reviews .tw-review-list .pagination a:focus-visible { outline:2px solid #d65c38; outline-offset:3px; }
