/* /includes/css/photoform.css */
.min-w-0 { min-width: 0; }

.ksw-photoform {
	--ksw-photoform-tile-radius: 0.75rem;
}

.ksw-photoform .ksw-photoform-toolbar .btn,
.ksw-photoform .ksw-photoform-toolbar .dropdown-menu {
	box-shadow: none;
}

.ksw-photoform .ksw-photoform-toolbar [data-ksw-photoform-remove-all] {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: calc(1.5em + .5rem + 2px);
}

.ksw-photoform-grid {
	align-items: stretch;
	overflow: visible;
}

.ksw-photoform-col {
	position: relative;
	overflow: visible;
	container-type: inline-size;
}

.ksw-photoform-col:hover,
.ksw-photoform-col:focus-within {
	z-index: 30;
}

.ksw-photoform-grid.view-large > [data-ksw-photoform-tile] {
	flex: 0 0 100%;
	max-width: 100%;
}

@media (min-width: 992px) {
	.ksw-photoform-grid.view-large > [data-ksw-photoform-tile] {
		flex: 0 0 50%;
		max-width: 50%;
	}
}

.ksw-photoform .grid-item {
	position: relative;
	height: 100%;
	border-radius: var(--ksw-photoform-tile-radius);
	background: #fff;
	box-shadow: 0 1px 2px rgba(0,0,0,.08);
	overflow: visible;
	cursor: grab;
}

.ksw-photoform .grid-item:hover,
.ksw-photoform .grid-item:focus-within {
	z-index: 30;
}

.ksw-photoform .grid-item:active {
	cursor: grabbing;
}

.ksw-photoform .thumbnail-wrapper {
	position: relative;
	height: 100%;
	overflow: visible;
}

.ksw-photoform .thumb-lightbox,
.ksw-photoform .thumb-ratio {
	display: block;
	width: 100%;
}

.ksw-photoform .thumb-ratio {
	aspect-ratio: 1 / 1;
	background: rgba(0,0,0,.05);
	border-radius: var(--ksw-photoform-tile-radius);
	overflow: hidden;
}

.ksw-photoform-grid.view-large .thumb-ratio {
	aspect-ratio: 16 / 9;
}

.ksw-photoform .thumb-ratio img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ksw-photoform .ksw-photoform-missing {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 1rem;
	text-align: center;
	font-size: .85rem;
	color: #6c757d;
}

.ksw-photoform .photo-caption {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	padding: .45rem .6rem;
	font-size: .85rem;
	line-height: 1.2;
	color: #fff;
	background: linear-gradient(transparent, rgba(0,0,0,.72));
	border-bottom-left-radius: var(--ksw-photoform-tile-radius);
	border-bottom-right-radius: var(--ksw-photoform-tile-radius);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	pointer-events: none;
}

.ksw-photoform .hover-menu {
	position: absolute;
	top: .5rem;
	right: .5rem;
	z-index: 12;
	opacity: 1;
}

.ksw-photoform .hover-menu .dropdown-menu {
	min-width: 13rem;
	z-index: 1060;
}

.ksw-photoform .gallery-tag-actions {
	position: absolute;
	top: .5rem;
	left: .5rem;
	z-index: 10;
	display: flex;
	flex-direction: column;
	gap: .35rem;
}

.ksw-photoform .cover-star,
.ksw-photoform .favourite-heart,
.ksw-photoform .me-user,
.ksw-photoform .privacy-eye {
	position: relative;
	width: 2rem;
	height: 2rem;
	border-radius: 999px;
	border: 0;
	background: rgba(0,0,0,.58);
	color: #fff;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	line-height: 1;
	box-shadow: 0 1px 2px rgba(0,0,0,.25);
}

@container (max-width: 180px) {
	.ksw-photoform .gallery-tag-actions {
		flex-direction: row;
		flex-wrap: wrap;
		width: 4.45rem;
	}
}

@media (max-width: 420px) {
	.ksw-photoform .gallery-tag-actions {
		flex-direction: row;
		flex-wrap: wrap;
		width: 4.45rem;
	}
}

.ksw-photoform .cover-star .fas,
.ksw-photoform .grid-item.is-cover .cover-star i {
	color: #ffc107;
}

.ksw-photoform .favourite-heart .fas,
.ksw-photoform .grid-item.is-favourite .favourite-heart i {
	color: #ff5b7f;
}

.ksw-photoform .grid-item.is-me .me-user i {
	color: #8ec5ff;
}

.ksw-photoform .grid-item.is-private .privacy-eye i {
	color: #ffc107;
}

.ksw-photoform .fav-order {
	position: absolute;
	top: -.35rem;
	right: -.35rem;
	min-width: 1.1rem;
	height: 1.1rem;
	padding: 0 .25rem;
	border-radius: 999px;
	font-size: .65rem;
	line-height: 1.1rem;
	background: #fff;
	color: #212529;
	font-weight: 700;
}

.ksw-photoform .fav-order:empty,
.ksw-photoform .fav-order.d-none,
.ksw-photoform .grid-item:not(.is-favourite) .fav-order {
	display: none;
}

.ksw-photoform .fav-section .fav-preview-item {
	position: relative;
	border-radius: .5rem;
	overflow: hidden;
	background: rgba(0,0,0,.06);
	cursor: grab;
}

.ksw-photoform .fav-section .fav-preview-item:active {
	cursor: grabbing;
}

.ksw-photoform .fav-section .fav-preview-item img {
	display: block;
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
}

.ksw-photoform .fav-section .fav-preview-number {
	position: absolute;
	top: .35rem;
	left: .35rem;
	z-index: 2;
	border-radius: 999px;
	background: rgba(0,0,0,.72);
	color: #fff;
	font-size: .75rem;
	font-weight: 700;
	padding: .15rem .4rem;
}

.ksw-photoform .admin-media-sortable-ghost,
.ksw-fileform .admin-media-sortable-ghost {
	opacity: .35;
}

.ksw-photoform .admin-media-sortable-chosen,
.ksw-fileform .admin-media-sortable-chosen {
	z-index: 20;
}

.ksw-photoform .admin-media-sortable-drag,
.ksw-fileform .admin-media-sortable-drag,
.ksw-photoform-drag-helper,
.ksw-photoform-fav-drag-helper,
.ksw-fileform-drag-helper {
	opacity: .95;
}

.ksw-photoform-drag-helper,
.ksw-photoform-fav-drag-helper,
.ksw-fileform-drag-helper {
	box-sizing: border-box;
	pointer-events: none;
	z-index: 1060;
}

.ksw-photoform-drag-helper .grid-item {
	position: relative;
	height: 100%;
	border-radius: var(--ksw-photoform-tile-radius, .75rem);
	background: #fff;
	box-shadow: 0 1px 2px rgba(0,0,0,.08);
	overflow: visible;
}

.ksw-photoform-drag-helper .thumbnail-wrapper {
	position: relative;
	height: 100%;
	overflow: visible;
}

.ksw-photoform-drag-helper .thumb-lightbox,
.ksw-photoform-drag-helper .thumb-ratio {
	display: block;
	width: 100%;
}

.ksw-photoform-drag-helper .thumb-ratio {
	aspect-ratio: 1 / 1;
	background: rgba(0,0,0,.05);
	border-radius: var(--ksw-photoform-tile-radius, .75rem);
	overflow: hidden;
}

.ksw-photoform-drag-helper.ksw-photoform-drag-helper-large .thumb-ratio {
	aspect-ratio: 16 / 9;
}

.ksw-photoform-drag-helper .thumb-ratio img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ksw-photoform-drag-helper .photo-caption {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	padding: .45rem .6rem;
	font-size: .85rem;
	line-height: 1.2;
	color: #fff;
	background: linear-gradient(transparent, rgba(0,0,0,.72));
	border-bottom-left-radius: var(--ksw-photoform-tile-radius, .75rem);
	border-bottom-right-radius: var(--ksw-photoform-tile-radius, .75rem);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	pointer-events: none;
}

.ksw-photoform-drag-helper .gallery-tag-actions {
	position: absolute;
	top: .5rem;
	left: .5rem;
	z-index: 10;
	display: flex;
	flex-direction: column;
	gap: .35rem;
}

.ksw-photoform-drag-helper .cover-star,
.ksw-photoform-drag-helper .favourite-heart,
.ksw-photoform-drag-helper .me-user,
.ksw-photoform-drag-helper .privacy-eye {
	position: relative;
	width: 2rem;
	height: 2rem;
	border-radius: 999px;
	border: 0;
	background: rgba(0,0,0,.58);
	color: #fff;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 0;
	line-height: 1;
	box-shadow: 0 1px 2px rgba(0,0,0,.25);
}

.ksw-photoform-drag-helper .hover-menu {
	position: absolute;
	top: .5rem;
	right: .5rem;
	z-index: 12;
	opacity: 1;
}

.ksw-photoform-drag-helper .dropdown-menu {
	display: none !important;
}

.ksw-photoform-drag-helper .fav-order:empty,
.ksw-photoform-drag-helper .fav-order.d-none,
.ksw-photoform-drag-helper .grid-item:not(.is-favourite) .fav-order {
	display: none;
}

.ksw-photoform-fav-drag-helper {
	border-radius: .5rem;
	overflow: visible;
}

.ksw-photoform-fav-drag-helper .fav-preview-item {
	position: relative;
	border-radius: .5rem;
	overflow: hidden;
	background: rgba(0,0,0,.06);
	cursor: grabbing;
}

.ksw-photoform-fav-drag-helper .fav-preview-item img {
	display: block;
	width: 100%;
	aspect-ratio: 1 / 1;
	object-fit: cover;
}

.ksw-photoform-fav-drag-helper .fav-preview-number {
	position: absolute;
	top: .35rem;
	left: .35rem;
	z-index: 2;
	border-radius: 999px;
	background: rgba(0,0,0,.72);
	color: #fff;
	font-size: .75rem;
	font-weight: 700;
	padding: .15rem .4rem;
}

.ksw-fileform-list {
	display: flex;
	flex-direction: column;
	gap: .75rem;
}

.ksw-fileform-item {
	border: 1px solid rgba(0,0,0,.125);
	border-radius: .5rem;
	background: #fff;
}

.ksw-fileform-handle {
	cursor: grab;
	color: rgba(0,0,0,.45);
}

.ksw-fileform-handle:active {
	cursor: grabbing;
}

.ksw-fileform .btn {
	box-shadow: none;
}


/* Sortable fallback clones are appended to <body>, so they do not inherit Bootstrap row gutter rules.
   These rules keep the helper's controls anchored to the same thumbnail box the user sees in the grid. */
.ksw-photoform-drag-helper,
.ksw-photoform-fav-drag-helper,
.ksw-fileform-drag-helper {
	margin: 0 !important;
}

.ksw-photoform-drag-helper > .grid-item,
.ksw-photoform-fav-drag-helper > .fav-preview-item {
	margin: 0 !important;
}

.ksw-photoform-drag-helper .thumbnail-wrapper,
.ksw-photoform-drag-helper .thumb-lightbox,
.ksw-photoform-drag-helper .thumb-ratio {
	max-width: 100%;
}

.ksw-photoform-drag-helper .gallery-tag-actions,
.ksw-photoform-drag-helper .hover-menu {
	transform: none !important;
}
