/* AXCYS Product Categories — Frontend v2.0
   Typography intentionally inherits from the active theme (font-family: inherit). */

.axcys-pc {
	--axcys-size: 120px;
	--axcys-gap: 20px;
	--axcys-cols: 4;
	--axcys-cols-t: 3;
	--axcys-cols-m: 2;
	--axcys-border-w: 0px;
	--axcys-border-color: transparent;
	position: relative;
	font-family: inherit;
	margin: 1em 0;
}

.axcys-pc-notice { opacity: .7; font-style: italic; }

/* ---------- Grid layout ---------- */
.axcys-pc-grid {
	display: grid;
	grid-template-columns: repeat(var(--axcys-cols), minmax(0, max-content));
	gap: var(--axcys-gap);
}
@media (max-width: 1024px) {
	.axcys-pc-grid { grid-template-columns: repeat(var(--axcys-cols-t), minmax(0, max-content)); }
}
@media (max-width: 600px) {
	.axcys-pc-grid { grid-template-columns: repeat(var(--axcys-cols-m), minmax(0, max-content)); }
}

/* Block alignment */
.axcys-pc-align-left .axcys-pc-grid   { justify-content: flex-start; }
.axcys-pc-align-center .axcys-pc-grid { justify-content: center; }
.axcys-pc-align-right .axcys-pc-grid  { justify-content: flex-end; }

/* ---------- Item ---------- */
.axcys-pc-item {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 8px;
	text-decoration: none !important;
	color: inherit;
	text-align: center;
	box-shadow: none !important;
}

/* Text positions */
.axcys-pc-text-top .axcys-pc-item    { flex-direction: column-reverse; }
.axcys-pc-text-left .axcys-pc-item   { flex-direction: row-reverse; text-align: right; }
.axcys-pc-text-right .axcys-pc-item  { flex-direction: row; text-align: left; }
.axcys-pc-text-left .axcys-pc-caption,
.axcys-pc-text-right .axcys-pc-caption { align-self: center; }

.axcys-pc-text-overlay .axcys-pc-item { position: relative; }
.axcys-pc-text-overlay .axcys-pc-caption {
	position: absolute;
	inset: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: rgba(0, 0, 0, .35);
	color: #fff;
	border-radius: inherit;
	opacity: 1;
	transition: background .25s ease;
	padding: 6px;
}
.axcys-pc-text-overlay .axcys-pc-item:hover .axcys-pc-caption { background: rgba(0, 0, 0, .55); }
.axcys-pc-text-overlay .axcys-pc-media { border-radius: inherit; }

/* ---------- Media + shapes ---------- */
.axcys-pc-media {
	position: relative;
	display: block;
	width: var(--axcys-size);
	height: var(--axcys-size);
	flex: 0 0 auto;
	overflow: hidden;
	border: var(--axcys-border-w) solid var(--axcys-border-color);
	box-sizing: border-box;
}
.axcys-pc-media img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transition: transform .3s ease;
}
.axcys-pc-hoverzoom .axcys-pc-item:hover .axcys-pc-media img { transform: scale(1.08); }

.axcys-pc-shape-circle  .axcys-pc-media,
.axcys-pc-shape-circle  .axcys-pc-text-overlay .axcys-pc-caption { border-radius: 50%; }
.axcys-pc-shape-square  .axcys-pc-media { border-radius: 0; }
.axcys-pc-shape-rounded .axcys-pc-media { border-radius: 18px; }
.axcys-pc-shape-blob    .axcys-pc-media { border-radius: 38% 62% 55% 45% / 45% 38% 62% 55%; }

.axcys-pc-shape-circle .axcys-pc-item,
.axcys-pc-shape-rounded .axcys-pc-item,
.axcys-pc-shape-blob .axcys-pc-item { border-radius: inherit; }

/* Overlay caption follows the shape */
.axcys-pc-shape-circle.axcys-pc-text-overlay  .axcys-pc-caption { border-radius: 50%; }
.axcys-pc-shape-rounded.axcys-pc-text-overlay .axcys-pc-caption { border-radius: 18px; }
.axcys-pc-shape-blob.axcys-pc-text-overlay    .axcys-pc-caption { border-radius: 38% 62% 55% 45% / 45% 38% 62% 55%; }

/* ---------- Caption ---------- */
.axcys-pc-caption { line-height: 1.3; }
.axcys-pc-title {
	display: block;
	font-weight: 600;
	font-size: var(--axcys-title-size, 0.95em);
	color: var(--axcys-title-color, inherit);
}
.axcys-pc-count {
	position: absolute;
	top: 6%;
	right: 6%;
	min-width: 1.7em;
	height: 1.7em;
	padding: 0 .35em;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--axcys-count-color, #111);
	color: #fff;
	font-size: .75em;
	border-radius: 999px;
	z-index: 2;
}
.axcys-pc-count-inline { font-size: .8em; opacity: .9; }

/* ---------- Carousel / Swiper ---------- */
.axcys-pc-swiper .swiper { padding-bottom: 6px; }
.axcys-pc-swiper .swiper-slide {
	width: auto;
	display: flex;
	justify-content: center;
	height: auto;
	box-sizing: border-box;
}
.axcys-pc-layout-slider .swiper-slide { justify-content: center; }

/* Ticker: linear continuous movement */
.axcys-pc-style-ticker .swiper-wrapper { transition-timing-function: linear !important; }

/* ---------- Edge effects (sides of the carousel) ----------
   Fixes the abrupt cut at the sides: items fade in/out smoothly,
   like a brand logo ticker. --axcys-edge controls the zone width. */

/* Soft fade: gradient mask, items remain partially visible while leaving */
.axcys-pc-edge-fade .swiper {
	-webkit-mask-image: linear-gradient(to right,
		transparent 0%,
		#000 var(--axcys-edge, 12%),
		#000 calc(100% - var(--axcys-edge, 12%)),
		transparent 100%);
	mask-image: linear-gradient(to right,
		transparent 0%,
		#000 var(--axcys-edge, 12%),
		#000 calc(100% - var(--axcys-edge, 12%)),
		transparent 100%);
}

/* Strong fade: longer, eased gradient — fully dissolves toward the edge */
.axcys-pc-edge-fade-strong .swiper {
	-webkit-mask-image: linear-gradient(to right,
		transparent 0%,
		rgba(0,0,0,.35) calc(var(--axcys-edge, 12%) * 0.6),
		#000 calc(var(--axcys-edge, 12%) * 1.8),
		#000 calc(100% - var(--axcys-edge, 12%) * 1.8),
		rgba(0,0,0,.35) calc(100% - var(--axcys-edge, 12%) * 0.6),
		transparent 100%);
	mask-image: linear-gradient(to right,
		transparent 0%,
		rgba(0,0,0,.35) calc(var(--axcys-edge, 12%) * 0.6),
		#000 calc(var(--axcys-edge, 12%) * 1.8),
		#000 calc(100% - var(--axcys-edge, 12%) * 1.8),
		rgba(0,0,0,.35) calc(100% - var(--axcys-edge, 12%) * 0.6),
		transparent 100%);
}

/* Blur: frosted edges over the sides + light mask so it never cuts hard */
.axcys-pc-edge-blur .swiper {
	-webkit-mask-image: linear-gradient(to right,
		transparent 0%, #000 calc(var(--axcys-edge, 12%) * 0.5),
		#000 calc(100% - var(--axcys-edge, 12%) * 0.5), transparent 100%);
	mask-image: linear-gradient(to right,
		transparent 0%, #000 calc(var(--axcys-edge, 12%) * 0.5),
		#000 calc(100% - var(--axcys-edge, 12%) * 0.5), transparent 100%);
}
.axcys-pc-edge-blur::before,
.axcys-pc-edge-blur::after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	width: var(--axcys-edge, 12%);
	z-index: 4;
	pointer-events: none;
	-webkit-backdrop-filter: blur(4px);
	backdrop-filter: blur(4px);
}
.axcys-pc-edge-blur::before {
	left: 0;
	-webkit-mask-image: linear-gradient(to right, #000, transparent);
	mask-image: linear-gradient(to right, #000, transparent);
}
.axcys-pc-edge-blur::after {
	right: 0;
	-webkit-mask-image: linear-gradient(to left, #000, transparent);
	mask-image: linear-gradient(to left, #000, transparent);
}

/* Scale + fade: per-slide opacity/scale handled by JS as slides approach
   the edges; transform transitions keep ticker movement smooth. */
.axcys-pc-edge-scale .swiper-slide .axcys-pc-item {
	transition: opacity .12s linear, transform .12s linear;
	will-change: opacity, transform;
}
.axcys-pc-edge-scale .swiper {
	-webkit-mask-image: linear-gradient(to right,
		transparent 0%, #000 4%, #000 96%, transparent 100%);
	mask-image: linear-gradient(to right,
		transparent 0%, #000 4%, #000 96%, transparent 100%);
}

/* Navigation arrows */
.axcys-pc-nav {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 38px;
	height: 38px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #fff;
	border-radius: 50%;
	box-shadow: 0 2px 8px rgba(0, 0, 0, .18);
	cursor: pointer;
	z-index: 5;
	user-select: none;
	font-size: 16px;
	line-height: 1;
	transition: transform .15s ease, box-shadow .15s ease;
}
.axcys-pc-nav:hover { transform: translateY(-50%) scale(1.08); box-shadow: 0 4px 14px rgba(0,0,0,.25); }
.axcys-pc-prev { left: -10px; }
.axcys-pc-next { right: -10px; }
.axcys-pc-nav.swiper-button-disabled { opacity: .35; cursor: default; }

/* Dots */
.axcys-pc-dots { text-align: center; margin-top: 10px; }
.axcys-pc-dots .swiper-pagination-bullet { margin: 0 4px; }

/* Slider layout: bigger stage */
.axcys-pc-layout-slider .axcys-pc-media { width: min(var(--axcys-size), 90vw); height: var(--axcys-size); }

@media (max-width: 600px) {
	.axcys-pc-prev { left: 0; }
	.axcys-pc-next { right: 0; }
}