/* ============================================================
	Sahityacafe UI interactions
	Site-wide hover polish and scroll reveal.
	Applied on top of the theme stylesheet.
	All motion uses transform/opacity only (GPU friendly).
	Respects prefers-reduced-motion.
	============================================================ */

/* ------------------------------------------------------------------
	  1. CARDS — standard blog cards (archive / category / search)
	  1a. Hover lift + soft shadow
------------------------------------------------------------------- */
.content-masonry article.hentry {
	-webkit-transition: -webkit-transform 0.35s cubic-bezier(0.22, 0.61, 0.36, 1),
	                    box-shadow 0.35s ease,
	                    border-color 0.35s ease;
	transition: transform 0.35s cubic-bezier(0.22, 0.61, 0.36, 1),
	            box-shadow 0.35s ease,
	            border-color 0.35s ease;
	will-change: transform;
}

.content-masonry article.hentry:hover {
	-webkit-transform: translateY(-4px);
	transform: translateY(-4px);
	border-color: #ddcfc0;
	box-shadow: 0 2px 6px rgba(60, 30, 10, 0.05), 0 18px 34px -16px rgba(60, 30, 10, 0.22);
}

/* Border/radius support: when theme adds borders to cards, keep them visible on hover */
.content-masonry.verbosa-elementborder article.hentry:hover {
	border-color: #d8c9ba;
}

/* ------------------------------------------------------------------
	  1b. Card image zoom (responsive-featured <img> variant)
------------------------------------------------------------------- */
.content-masonry article.hentry .post-thumbnail-container {
	overflow: hidden;
}

.content-masonry article.hentry .responsive-featured-image {
	display: block;
	overflow: hidden;
}

.content-masonry article.hentry .responsive-featured-image img.post-featured-image {
	-webkit-transition: -webkit-transform 0.55s cubic-bezier(0.22, 0.61, 0.36, 1);
	transition: transform 0.55s cubic-bezier(0.22, 0.61, 0.36, 1);
	will-change: transform;
}

.content-masonry article.hentry:hover .responsive-featured-image img.post-featured-image {
	-webkit-transform: scale(1.05);
	transform: scale(1.05);
}

/* Card image zoom (background-image variant) — gentle pan on hover */
.content-masonry article.hentry:hover a.post-featured-image {
	background-position: 50% 18%;
}

/* ------------------------------------------------------------------
	  1c. Card title colour transition
------------------------------------------------------------------- */
.content-masonry article.hentry .entry-title a {
	-webkit-transition: color 0.25s ease;
	transition: color 0.25s ease;
}

.content-masonry article.hentry:hover .entry-title a {
	color: #8b0000;
}

/* ------------------------------------------------------------------
	  2. BUTTONS — smooth transitions across the site
------------------------------------------------------------------- */
a.continue-reading-link,
.button,
button,
input[type="button"],
input[type="submit"],
input[type="reset"],
.wp-block-button__link,
#respond .form-submit input[type="submit"] {
	-webkit-transition-property: background-color, color, border-color, box-shadow, -webkit-transform;
	transition-property: background-color, color, border-color, box-shadow, transform;
	-webkit-transition-duration: 0.25s;
	transition-duration: 0.25s;
	-webkit-transition-timing-function: ease;
	transition-timing-function: ease;
}

a.continue-reading-link:hover,
.button:hover,
button:hover:not(:disabled),
input[type="button"]:hover:not(:disabled),
input[type="submit"]:hover:not(:disabled),
input[type="reset"]:hover:not(:disabled),
.wp-block-button__link:hover,
#respond .form-submit input[type="submit"]:hover {
	-webkit-transform: translateY(-1px);
	transform: translateY(-1px);
	box-shadow: 0 6px 16px -6px rgba(60, 30, 10, 0.25);
}

a.continue-reading-link:active,
.button:active,
button:active:not(:disabled),
input[type="button"]:active:not(:disabled),
input[type="submit"]:active:not(:disabled),
input[type="reset"]:active:not(:disabled),
.wp-block-button__link:active,
#respond .form-submit input[type="submit"]:active {
	-webkit-transform: translateY(0);
	transform: translateY(0);
}

/* Pagination number buttons */
.pagination span,
.pagination a {
	-webkit-transition: -webkit-transform 0.25s ease, background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
	transition: transform 0.25s ease, background-color 0.25s ease, color 0.25s ease, border-color 0.25s ease, box-shadow 0.25s ease;
}

.pagination a:hover,
.pagination span:hover {
	-webkit-transform: translateY(-2px);
	transform: translateY(-2px);
	box-shadow: 0 6px 14px -6px rgba(60, 30, 10, 0.25);
}

/* ------------------------------------------------------------------
	  3. MENUS — slide indicator on the primary sidebar menu
------------------------------------------------------------------- */
#access li a span::after {
	content: "";
	position: absolute;
	right: 100%;              /* starts hidden (off to the right of the dot) */
	bottom: 0.35em;
	left: -0.9em;
	height: 2px;
	background-color: #8b0000;
	-webkit-transform: scaleX(0);
	transform: scaleX(0);
	-webkit-transform-origin: left center;
	transform-origin: left center;
	-webkit-transition: -webkit-transform 0.4s cubic-bezier(0.22, 0.61, 0.36, 1);
	transition: transform 0.4s cubic-bezier(0.22, 0.61, 0.36, 1);
}

#access li a:hover span::after,
#access li.current-menu-item > a span::after,
#access li.current_page_item > a span::after {
	-webkit-transform: scaleX(1);
	transform: scaleX(1);
}

/* ------------------------------------------------------------------
	  4. DROPDOWNS — fade + subtle slide for #access sub-menus.
	     Implemented in functions.php inline CSS (hover + .toggled-on).
------------------------------------------------------------------- */

/* ------------------------------------------------------------------
	  5. SCROLL REVEAL — standard cards on list pages
	     (html.js is added by ui-interactions.js; no-JS users see content)
------------------------------------------------------------------- */
html.uijs .content-masonry article.hentry {
	opacity: 0;
	-webkit-transform: translateY(16px);
	transform: translateY(16px);
	-webkit-transition: opacity 0.55s ease, -webkit-transform 0.55s ease;
	transition: opacity 0.55s ease, transform 0.55s ease;
}

html.uijs .content-masonry article.hentry.ui-reveal {
	opacity: 1;
	-webkit-transform: none;
	transform: none;
}

/* ------------------------------------------------------------------
	  6. REDUCED MOTION — disable all of the above
------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	.content-masonry article.hentry,
	.content-masonry article.hentry .responsive-featured-image img.post-featured-image,
	.content-masonry article.hentry .entry-title a,
	a.continue-reading-link,
	.button,
	button,
	input[type="button"],
	input[type="submit"],
	input[type="reset"],
	.wp-block-button__link,
	#respond .form-submit input[type="submit"],
	.pagination span,
	.pagination a,
	#access li a span::after,
	#access ul.sub-menu,
	nav .sub-menu,
	nav .children {
		-webkit-transition: none !important;
		transition: none !important;
	}

	html.uijs .content-masonry article.hentry,
	.content-masonry article.hentry:hover {
		opacity: 1 !important;
		-webkit-transform: none !important;
		transform: none !important;
		box-shadow: none !important;
	}
}