/* Created by Claude Code - 2026-07-17 - Scoped catalog styles (.amk- prefix), responsive to 360px. */

.amk-katalogas {
	--amk-bg: #f6f7f9;
	--amk-card: #ffffff;
	--amk-text: #1f2937;
	--amk-muted: #6b7280;
	--amk-accent: #FF9900;
	--amk-star: #f59e0b;
	--amk-border: #e5e7eb;
	--amk-radius: 8px;
	--amk-shadow: 0 1px 3px rgba(17, 24, 39, .07), 0 1px 2px rgba(17, 24, 39, .05);
	background: var(--amk-bg);
	color: var(--amk-text);
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	font-size: 15px;
	line-height: 1.5;
	padding: 16px;
	border-radius: var(--amk-radius);
}

.amk-katalogas *,
.amk-katalogas *::before,
.amk-katalogas *::after {
	box-sizing: border-box;
}

/* ---------- Layout ---------- */

.amk-layout {
	display: flex;
	gap: 24px;
	align-items: flex-start;
}

.amk-main {
	flex: 1 1 auto;
	min-width: 0;
}

/* ---------- Sidebar (desktop) ---------- */

/* Edited by Claude Code - 2026-07-19 - widened 260->280px so category names have more room on desktop. */
.amk-sidebar {
	flex: 0 0 280px;
	width: 280px;
	position: sticky;
	top: 16px;
	max-height: calc(100vh - 32px);
	overflow-y: auto;
	background: var(--amk-card);
	border: 1px solid var(--amk-border);
	border-radius: var(--amk-radius);
	box-shadow: var(--amk-shadow);
	padding: 16px;
}

.amk-sidebar-head {
	display: none;
	justify-content: space-between;
	align-items: center;
	font-weight: 600;
	margin-bottom: 12px;
}

.amk-drawer-close {
	background: none;
	border: none;
	font-size: 18px;
	cursor: pointer;
	color: var(--amk-muted);
	padding: 4px 8px;
}

.amk-search input[type="search"] {
	width: 100%;
	padding: 9px 12px;
	border: 1px solid var(--amk-border);
	border-radius: var(--amk-radius);
	font-size: 14px;
	background: #fff;
	color: var(--amk-text);
}

.amk-search input[type="search"]:focus {
	outline: 2px solid var(--amk-accent);
	outline-offset: 1px;
	border-color: var(--amk-accent);
}

.amk-cats {
	margin-top: 14px;
}

.amk-cats ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.amk-cats li {
	margin: 0;
}

.amk-cats a {
	display: flex;
	align-items: center;
	gap: 6px;
	padding: 7px 8px;
	border-radius: 6px;
	color: var(--amk-text);
	text-decoration: none;
	font-size: 14px;
}

.amk-cats a:hover {
	background: var(--amk-bg);
}

.amk-cats a.amk-active {
	background: #fff4e5;
	font-weight: 600;
}

.amk-cat-emoji {
	flex: 0 0 auto;
	width: 1.4em;
	text-align: center;
}

/* Edited by Claude Code - 2026-07-19 - wrap long LT names instead of truncating with an ellipsis. */
.amk-cat-name {
	flex: 1 1 auto;
	min-width: 0;
	white-space: normal;
	overflow-wrap: break-word;
	line-height: 1.25;
}

.amk-cat-count {
	flex: 0 0 auto;
	font-size: 12px;
	color: var(--amk-muted);
	background: var(--amk-bg);
	border-radius: 10px;
	padding: 1px 8px;
}

/* ---------- Filters ---------- */

.amk-filters-title {
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: .04em;
	color: var(--amk-muted);
	margin: 18px 0 8px;
}

.amk-filter-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.amk-filter {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 5px 8px;
	border-radius: 6px;
	color: var(--amk-text);
	text-decoration: none;
	font-size: 14px;
}

.amk-filter:hover {
	background: var(--amk-bg);
}

.amk-box {
	flex: 0 0 auto;
	width: 16px;
	height: 16px;
	border: 2px solid #cbd5e1;
	border-radius: 4px;
	background: #fff;
	position: relative;
}

.amk-filter.amk-checked .amk-box {
	background: var(--amk-accent);
	border-color: var(--amk-accent);
}

.amk-filter.amk-checked .amk-box::after {
	content: "";
	position: absolute;
	left: 4px;
	top: 1px;
	width: 4px;
	height: 8px;
	border: solid #fff;
	border-width: 0 2px 2px 0;
	transform: rotate(45deg);
}

/* ---------- Top bar + chips (mobile only) ---------- */

.amk-topbar,
.amk-chips {
	display: none;
}

/* ---------- Toolbar ---------- */

.amk-heading {
	font-size: 24px;
	margin: 0 0 6px;
	line-height: 1.25;
}

.amk-intro {
	color: var(--amk-muted);
	margin: 0 0 6px;
}

.amk-breadcrumb {
	font-size: 13px;
	color: var(--amk-muted);
	margin-bottom: 14px;
}

.amk-breadcrumb a {
	color: var(--amk-muted);
	text-decoration: none;
}

.amk-breadcrumb a:hover {
	text-decoration: underline;
}

.amk-toolbar {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
	margin-bottom: 16px;
}

.amk-count {
	font-size: 14px;
	color: var(--amk-muted);
}

.amk-sort {
	display: flex;
	align-items: center;
	gap: 8px;
}

.amk-sort-label {
	font-size: 14px;
	color: var(--amk-muted);
}

.amk-sort select {
	padding: 7px 10px;
	border: 1px solid var(--amk-border);
	border-radius: var(--amk-radius);
	background: #fff;
	color: var(--amk-text);
	font-size: 14px;
}

/* ---------- Highlight strips ---------- */

.amk-strip {
	margin-bottom: 20px;
}

.amk-strip-title {
	font-size: 18px;
	margin: 0 0 10px;
}

.amk-strip-row {
	display: flex;
	gap: 14px;
	overflow-x: auto;
	padding-bottom: 8px;
	scroll-snap-type: x proximity;
	-webkit-overflow-scrolling: touch;
}

.amk-strip-row .amk-card {
	flex: 0 0 230px;
	width: 230px;
	scroll-snap-align: start;
}

/* ---------- Grid ---------- */

.amk-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
	gap: 16px;
}

/* ---------- Card ---------- */

.amk-card {
	background: var(--amk-card);
	border: 1px solid var(--amk-border);
	border-radius: var(--amk-radius);
	box-shadow: var(--amk-shadow);
	display: flex;
	flex-direction: column;
	overflow: hidden;
	transition: box-shadow .15s ease, transform .15s ease;
}

.amk-card:hover {
	box-shadow: 0 4px 12px rgba(17, 24, 39, .12);
	transform: translateY(-2px);
}

.amk-card-media {
	position: relative;
	display: block;
	width: 100%;
	background: #fff;
	border: none;
	padding: 16px;
	cursor: pointer;
	height: 190px;
	text-decoration: none; /* Edited by Claude Code - 2026-07-18 - media is now a link */
}

.amk-card-media img {
	max-width: 100%;
	max-height: 100%;
	width: auto;
	height: auto;
	margin: 0 auto;
	display: block;
	object-fit: contain;
}

.amk-noimage {
	font-size: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	opacity: .4;
}

.amk-badge-discount {
	position: absolute;
	top: 10px;
	left: 10px;
	background: #dc2626;
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	padding: 3px 8px;
	border-radius: 6px;
	z-index: 2;
}

.amk-badge-drop {
	position: absolute;
	bottom: 10px;
	left: 10px;
	right: 10px;
	background: #fee2e2;
	color: #b91c1c;
	font-size: 11px;
	font-weight: 600;
	padding: 3px 8px;
	border-radius: 6px;
	z-index: 2;
	text-align: center;
}

/* Edited by Claude Code - 2026-07-20 - manual "Nebegalioja" (expired) status: grey card + badge + disabled CTA. */
.amk-badge-expired {
	position: absolute;
	top: 10px;
	left: 10px;
	background: #6b7280;
	color: #fff;
	font-size: 12px;
	font-weight: 700;
	padding: 3px 8px;
	border-radius: 6px;
	z-index: 3;
}

.amk-card--expired {
	opacity: .6;
	filter: grayscale(65%);
}

.amk-card--expired:hover {
	box-shadow: var(--amk-shadow);
	transform: none;
}

.amk-product--expired .amk-product-media {
	opacity: .6;
	filter: grayscale(65%);
}

/* Edited by Claude Code - 2026-07-20 - expired buy button stays clickable (owner may reactivate later), just muted. */
.amk-buy--expired,
.amk-buy--expired:hover {
	background: #e5e7eb;
	color: #6b7280;
	filter: none;
}

.amk-card-body {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 12px 14px 14px;
	flex: 1 1 auto;
}

.amk-brand {
	font-size: 12px;
	color: var(--amk-muted);
	text-transform: uppercase;
	letter-spacing: .03em;
}

.amk-title {
	font-size: 14px;
	font-weight: 600;
	line-height: 1.35;
	margin: 0;
}

.amk-title-btn {
	background: none;
	border: none;
	padding: 0;
	margin: 0;
	font: inherit;
	color: inherit;
	text-align: left;
	cursor: pointer;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	text-decoration: none; /* Edited by Claude Code - 2026-07-18 - title is now a link */
}

.amk-title-btn:hover {
	color: var(--amk-accent);
}

.amk-pastaba {
	font-size: 12px;
	color: var(--amk-muted);
	margin: 0;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.amk-rating {
	display: flex;
	align-items: center;
	gap: 2px;
	color: var(--amk-star);
}

.amk-star--empty {
	color: #d1d5db;
}

.amk-rating-text {
	font-size: 13px;
	color: var(--amk-text);
	margin-left: 5px;
}

.amk-price-row {
	display: flex;
	align-items: baseline;
	gap: 8px;
	flex-wrap: wrap;
	margin-top: auto;
}

.amk-price {
	font-size: 17px;
	font-weight: 700;
}

.amk-price-old {
	font-size: 13px;
	color: var(--amk-muted);
	/* Edited by Claude Code - 2026-07-23 - removed strike-through: Kaina LT is a valid price, keep plain grey small text */
	text-decoration: none;
}

.amk-price-na {
	font-size: 14px;
	color: var(--amk-muted);
	font-style: italic;
}

.amk-badge-prime {
	background: #1399ff;
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	padding: 2px 7px;
	border-radius: 5px;
}

.amk-updated {
	font-size: 11px;
	color: var(--amk-muted);
	margin: 0;
}

/* Edited by Claude Code - 2026-07-18 - shipping line on the grid card */
.amk-card-siuntimas {
	font-size: 12px;
	color: #065f46;
}

/* Edited by Claude Code - 2026-07-18 - REHub theme sets ".post p { margin: 0 0 31px }", which inflated our
   caption gaps. These selectors (0,2,0) beat ".post p" (0,1,1), so the flex gap alone controls spacing. */
.amk-katalogas .amk-pastaba,
.amk-katalogas .amk-card-siuntimas,
.amk-katalogas .amk-updated,
.amk-katalogas .amk-product-siuntimas,
.amk-katalogas .amk-product-rank {
	margin: 0;
}

.amk-card-body .amk-buy {
	margin-top: 2px;
}

.amk-buy {
	display: block;
	text-align: center;
	background: var(--amk-accent);
	color: #111827;
	font-weight: 700;
	font-size: 14px;
	padding: 10px 14px;
	border-radius: var(--amk-radius);
	text-decoration: none;
	margin-top: 8px;
	transition: filter .12s ease;
}

.amk-buy:hover {
	filter: brightness(.94);
	color: #111827;
}

/* ---------- Inline details panel ---------- */

.amk-details {
	border-top: 1px solid var(--amk-border);
	padding: 14px;
	background: #fafbfc;
}

.amk-card.amk-open .amk-details {
	display: block;
}

.amk-details-img {
	max-width: 100%;
	max-height: 300px;
	width: auto;
	display: block;
	margin: 0 auto 12px;
	object-fit: contain;
}

.amk-details-title {
	font-size: 14px;
	margin: 0 0 8px;
}

.amk-features {
	margin: 0 0 12px;
	padding-left: 18px;
	font-size: 13px;
	color: var(--amk-text);
}

.amk-features li {
	margin-bottom: 4px;
}

/* ---------- Product page (?am_prod=) — Added by Claude Code - 2026-07-18 ---------- */

.amk-product {
	background: var(--amk-card);
	border: 1px solid var(--amk-border);
	border-radius: var(--amk-radius);
	box-shadow: var(--amk-shadow);
	padding: 24px;
}

.amk-product-top {
	display: flex;
	gap: 28px;
	align-items: flex-start;
}

/* Edited by Claude Code - 2026-07-18 - Title moved above; image column narrowed so info fits beside it. */
.amk-product-head {
	margin-bottom: 18px;
}

.amk-product-head .amk-brand {
	display: block;
	margin-bottom: 4px;
}

.amk-product-media {
	position: relative;
	flex: 0 0 30%;
	max-width: 30%;
	background: #fff;
	border-radius: var(--amk-radius);
	padding: 12px;
	text-align: center;
}

.amk-product-media img {
	max-width: 100%;
	max-height: 300px;
	width: auto;
	height: auto;
	object-fit: contain;
}

.amk-product-info {
	flex: 1 1 auto;
	min-width: 0;
	display: flex;
	flex-direction: column;
	gap: 10px;
}

/* Edited by Claude Code - 2026-07-18 - Info-column button sits close under the caption (base .amk-buy adds margin-top:8px). */
.amk-product-info .amk-buy--product {
	margin-top: 0;
}

.amk-product-title {
	font-size: 24px;
	line-height: 1.3;
	margin: 0;
}

.amk-product-rank {
	margin: 0;
	font-size: 14px;
	color: #92400e;
	background: #fef3c7;
	border-radius: 6px;
	padding: 6px 10px;
	display: inline-block;
	align-self: flex-start;
}

.amk-product-siuntimas {
	margin: 0;
	font-size: 14px;
	color: #065f46;
}

.amk-price-row--product .amk-price {
	font-size: 24px;
}

.amk-price-old--link {
	/* Edited by Claude Code - 2026-07-23 - removed strike-through, keep underline for the linked LT price */
	text-decoration: underline;
}

.amk-price-old--link:hover {
	color: var(--amk-accent);
}

.amk-buy--product {
	max-width: 320px;
	font-size: 16px;
	padding: 13px 18px;
}

.amk-product-section {
	margin-top: 28px;
	border-top: 1px solid var(--amk-border);
	padding-top: 18px;
}

.amk-product-section h2 {
	font-size: 19px;
	margin: 0 0 12px;
}

.amk-product-text {
	font-size: 15px;
	line-height: 1.65;
	color: var(--amk-text);
	max-width: 75ch;
}

.amk-product-text p {
	margin: 0 0 12px;
}

.amk-product-cta {
	margin-top: 24px;
	text-align: center;
}

.amk-product-cta .amk-buy--product {
	display: inline-block;
	min-width: 280px;
}

@media (max-width: 767px) {

	.amk-product {
		padding: 14px;
	}

	.amk-product-top {
		flex-direction: column;
		gap: 16px;
	}

	.amk-product-media {
		flex-basis: auto;
		max-width: 100%;
		width: 100%;
	}

	.amk-product-media img {
		max-height: 300px;
	}

	.amk-product-title {
		font-size: 20px;
	}
}

/* ---------- Pagination ---------- */

.amk-pagination {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	justify-content: center;
	margin: 24px 0 8px;
}

.amk-page {
	display: inline-block;
	padding: 7px 12px;
	border: 1px solid var(--amk-border);
	border-radius: var(--amk-radius);
	background: #fff;
	color: var(--amk-text);
	text-decoration: none;
	font-size: 14px;
}

.amk-page:hover {
	border-color: var(--amk-accent);
}

.amk-page--current {
	background: var(--amk-accent);
	border-color: var(--amk-accent);
	color: #111827;
	font-weight: 700;
}

.amk-page-dots {
	align-self: center;
	color: var(--amk-muted);
}

.amk-empty {
	background: var(--amk-card);
	border: 1px dashed var(--amk-border);
	border-radius: var(--amk-radius);
	padding: 32px;
	text-align: center;
	color: var(--amk-muted);
}

/* ---------- Disclosure ---------- */

.amk-disclosure {
	margin-top: 24px;
	font-size: 12px;
	color: var(--amk-muted);
	border-top: 1px solid var(--amk-border);
	padding-top: 12px;
}

/* ---------- Overlay (mobile drawer) ---------- */

.amk-overlay {
	position: fixed;
	inset: 0;
	background: rgba(17, 24, 39, .45);
	z-index: 9998;
}

/* ---------- Mobile < 1024px ---------- */

@media (max-width: 1023px) {

	.amk-topbar {
		display: flex;
		gap: 10px;
		align-items: center;
		position: sticky;
		top: 0;
		z-index: 100;
		background: var(--amk-bg);
		padding: 10px 0;
		margin-bottom: 4px;
	}

	.amk-search--top {
		flex: 1 1 auto;
	}

	.amk-drawer-btn {
		flex: 0 0 auto;
		background: var(--amk-card);
		border: 1px solid var(--amk-border);
		border-radius: var(--amk-radius);
		padding: 9px 14px;
		font-size: 14px;
		font-weight: 600;
		color: var(--amk-text);
		cursor: pointer;
	}

	.amk-chips {
		display: flex;
		gap: 8px;
		overflow-x: auto;
		padding: 4px 0 10px;
		-webkit-overflow-scrolling: touch;
	}

	.amk-chip {
		flex: 0 0 auto;
		background: var(--amk-card);
		border: 1px solid var(--amk-border);
		border-radius: 999px;
		padding: 6px 14px;
		font-size: 13px;
		color: var(--amk-text);
		text-decoration: none;
		white-space: nowrap;
	}

	.amk-chip--active {
		background: var(--amk-accent);
		border-color: var(--amk-accent);
		color: #111827;
		font-weight: 600;
	}

	/* Sidebar becomes a slide-in drawer. */
	.amk-sidebar {
		position: fixed;
		top: 0;
		left: 0;
		bottom: 0;
		width: min(320px, 85vw);
		max-height: none;
		border-radius: 0;
		transform: translateX(-105%);
		transition: transform .2s ease;
		z-index: 9999;
	}

	.amk-sidebar.amk-drawer-open {
		transform: translateX(0);
	}

	.amk-sidebar-head {
		display: flex;
	}

	/* Search inside the drawer is redundant on mobile (top bar has one). */
	.amk-sidebar > .amk-search {
		display: none;
	}
}

/* ---------- Small phones ---------- */

@media (max-width: 480px) {

	.amk-katalogas {
		padding: 10px;
	}

	.amk-grid {
		grid-template-columns: repeat(auto-fill, minmax(155px, 1fr));
		gap: 10px;
	}

	.amk-card-media {
		height: 150px;
		padding: 10px;
	}

	.amk-strip-row .amk-card {
		flex-basis: 185px;
		width: 185px;
	}

	.amk-heading {
		font-size: 20px;
	}

	.amk-price {
		font-size: 15px;
	}
}


/* Edited by Claude Code - 2026-07-23 - per-product reactions + comments */
.amk-reactions{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:22px 0 8px}
.amk-reactions-label{font-size:14px;color:var(--amk-muted);margin-right:4px}
.amk-react{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;border:1px solid var(--amk-border,#e2e5ea);border-radius:999px;background:#fff;cursor:pointer;font-size:14px;line-height:1;transition:background .15s,border-color .15s,transform .1s}
.amk-react:hover{background:#f5f7fa}
.amk-react:active{transform:scale(.96)}
.amk-react--active{border-color:var(--amk-accent,#e47911);background:#fff6ec}
.amk-react-emoji{font-size:17px}
.amk-react-label{font-weight:600}
.amk-react-count{min-width:14px;text-align:center;color:var(--amk-muted);font-variant-numeric:tabular-nums}
.amk-react--active .amk-react-count{color:var(--amk-accent,#e47911)}
.amk-react[disabled]{opacity:.6;cursor:default}
.amk-comments{margin:28px 0 0;padding-top:20px;border-top:1px solid var(--amk-border,#e2e5ea)}
.amk-comments-title{font-size:20px;margin:0 0 14px}
.amk-comment-list{list-style:none;margin:0 0 18px;padding:0}
.amk-comment-list .comment{margin:0 0 14px;padding:0}
.amk-comments-empty,.amk-comment-login{color:var(--amk-muted);font-size:14px}
.amk-comment-pending{background:#eaf7ee;border:1px solid #b7e0c2;color:#1e6b38;padding:10px 14px;border-radius:8px;font-size:14px;margin:0 0 14px}
.amk-comment-form textarea{width:100%;max-width:100%;box-sizing:border-box}


/* Edited by Claude Code - 2026-07-23 - PeepSo-style comments */
.amk-comment-list,.amk-comment-list .children{list-style:none;margin:0;padding:0}
.amk-comment-list{margin:0 0 18px}
.amk-comment-list .children{margin-left:54px}
.amk-comment{margin:0}
.amk-comment-body{display:flex;gap:12px;align-items:flex-start;padding:8px 0}
.amk-comment-avatar{width:44px;height:44px;border-radius:50%;overflow:hidden;flex:0 0 44px;background:#ece9f7}
.amk-comment-avatar img{width:100%;height:100%;object-fit:cover;display:block;border-radius:50%}
.amk-comment-main{flex:1 1 auto;min-width:0}
.amk-comment-line{background:#f1f2f4;border-radius:16px;padding:8px 14px;display:inline-block;max-width:100%}
.amk-comment-author{font-weight:700;color:#1c1e21}
.amk-comment-text{color:#1c1e21}
.amk-comment-text p{display:inline;margin:0}
.amk-comment-text p+p{display:block;margin-top:6px}
.amk-comment-meta{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin:3px 0 0 14px;font-size:13px;color:var(--amk-muted)}
.amk-comment-meta .comment-reply-link{color:var(--amk-accent,#e47911);font-weight:600;text-decoration:none}
.amk-comment-meta .comment-reply-link:hover{text-decoration:underline}
.amk-comment-sep{color:#c3c7cf}

/* Edited by Claude Code - 2026-07-23 - gap between reply-form title and Cancel-reply link */
.amk-comments .comment-reply-title small{margin-left:10px}
.amk-comments #cancel-comment-reply-link{margin-left:10px;color:var(--amk-muted);font-weight:400}