/* Medya Oluşum sitewide production views — layered on the approved category system. */

#mo-category.mo-production-view {
	min-height: 100vh;
}

#mo-category .mop-inline-search,
#mo-category .mop-empty-search,
#mo-category .mop-404-search {
	display: flex;
	min-width: min(100%, 420px);
	border: 1px solid var(--moh2-line);
	background: #fff;
}

#mo-category .mop-inline-search input,
#mo-category .mop-empty-search input,
#mo-category .mop-404-search input {
	min-width: 0;
	flex: 1;
	height: 46px;
	padding: 0 15px;
	border: 0;
	background: transparent;
	color: var(--moh2-ink);
	font: 600 14px/1 var(--moh2-sans);
}

#mo-category .mop-inline-search button,
#mo-category .mop-empty-search button,
#mo-category .mop-404-search button {
	min-width: 82px;
	border: 0;
	background: var(--moh2-red);
	color: #fff;
	font: 800 12px/1 var(--moh2-sans);
	text-transform: uppercase;
	cursor: pointer;
}

#mo-category .mop-pagination {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 7px;
	margin-top: 34px;
}

#mo-category .mop-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 42px;
	height: 42px;
	padding: 0 13px;
	border: 1px solid var(--moh2-line);
	background: #fff;
	color: var(--moh2-ink);
	font: 800 12px/1 var(--moh2-sans);
	text-decoration: none;
}

#mo-category .mop-pagination .current,
#mo-category .mop-pagination a:hover,
#mo-category .mop-pagination a:focus-visible {
	border-color: var(--moh2-red);
	background: var(--moh2-red);
	color: #fff;
}

#mo-category .mop-empty-state {
	display: grid;
	gap: 14px;
	padding: 46px;
	border: 1px solid var(--moh2-line);
	background: #fff;
	text-align: left;
}

#mo-category .mop-empty-state h2,
#mo-category .mop-empty-state p {
	margin: 0;
}

#mo-category .mop-empty-state h2 {
	font: 700 clamp(26px, 3vw, 38px)/1.08 var(--moh2-serif);
}

#mo-category .mop-empty-state p {
	color: var(--moh2-muted);
	font-size: var(--moh2-description-size);
	line-height: var(--moh2-description-line-height);
}

#mo-category .mop-page-band {
	padding-top: 44px;
}

#mo-category .mop-page-layout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) 331px;
	gap: 38px;
	align-items: start;
}

#mo-category .mop-page-article {
	min-width: 0;
}

#mo-category .mop-page-body {
	color: #1d2635;
	font: 400 18px/1.78 var(--moh2-serif);
}

#mo-category .mop-page-body > :first-child {
	margin-top: 0;
}

#mo-category .mop-page-body h2,
#mo-category .mop-page-body h3,
#mo-category .mop-page-body h4 {
	margin: 1.7em 0 .55em;
	color: var(--moh2-ink);
	font-family: var(--moh2-serif);
	line-height: 1.15;
}

#mo-category .mop-page-body h2 { font-size: clamp(27px, 3vw, 38px); }
#mo-category .mop-page-body h3 { font-size: clamp(22px, 2.4vw, 30px); }
#mo-category .mop-page-body h4 { font-size: 21px; }

#mo-category .mop-page-body p,
#mo-category .mop-page-body ul,
#mo-category .mop-page-body ol,
#mo-category .mop-page-body blockquote,
#mo-category .mop-page-body table,
#mo-category .mop-page-body figure {
	margin: 0 0 1.35em;
}

#mo-category .mop-page-body img,
#mo-category .mop-page-body iframe,
#mo-category .mop-page-body video {
	max-width: 100%;
	height: auto;
}

#mo-category .mop-page-body a {
	color: var(--moh2-red-dark);
	text-decoration: underline;
	text-underline-offset: 3px;
}

#mo-category .mop-page-body table {
	width: 100%;
	border-collapse: collapse;
}

#mo-category .mop-page-body th,
#mo-category .mop-page-body td {
	padding: 12px;
	border: 1px solid var(--moh2-line);
	text-align: left;
}

#mo-category .mop-page-body input:not([type="checkbox"]):not([type="radio"]),
#mo-category .mop-page-body textarea,
#mo-category .mop-page-body select {
	width: 100%;
	max-width: 100%;
	padding: 12px 14px;
	border: 1px solid #cfd4da;
	background: #fff;
	font: 500 15px/1.4 var(--moh2-sans);
}

#mo-category .mop-page-body input[type="submit"],
#mo-category .mop-page-body button {
	min-height: 44px;
	padding: 0 20px;
	border: 0;
	background: var(--moh2-red);
	color: #fff;
	font: 800 12px/1 var(--moh2-sans);
	text-transform: uppercase;
}

#mo-category .mop-page-campaign {
	margin: 0 0 34px;
}

#mo-category .mop-page-body + .mop-page-campaign {
	margin: 38px 0 0;
}

#mo-category .mop-404-hero {
	padding: 72px 0 78px;
	background: radial-gradient(circle at 85% 15%, rgba(211, 22, 29, .09), transparent 30%), linear-gradient(135deg, #faf8f5, #f3f0ec);
	text-align: center;
}

#mo-category .mop-404-hero .moh2-shell {
	display: flex;
	max-width: 860px;
	flex-direction: column;
	align-items: center;
}

#mo-category .mop-404-hero .moh2-shell > span {
	color: var(--moh2-red);
	font: 900 clamp(66px, 10vw, 128px)/.8 var(--moh2-sans);
	letter-spacing: -.07em;
	opacity: .14;
}

#mo-category .mop-404-hero h1 {
	max-width: 760px;
	margin: 14px 0 14px;
	color: var(--moh2-ink);
	font: 700 clamp(38px, 6vw, 70px)/1 var(--moh2-serif);
	letter-spacing: -.035em;
}

#mo-category .mop-404-hero p:not(.moc-category-mast__eyebrow) {
	max-width: 650px;
	margin: 0 0 26px;
	color: var(--moh2-muted);
	font-size: 17px;
	line-height: 1.6;
}

#mo-category .mop-404-search {
	width: min(100%, 620px);
	margin-bottom: 20px;
}

#mo-category .mop-home-link {
	color: var(--moh2-ink);
	font: 800 12px/1 var(--moh2-sans);
	letter-spacing: .04em;
	text-transform: uppercase;
}

#mo-category .mop-404-latest {
	padding: 54px 0 64px;
}

@media (max-width: 980px) {
	#mo-category .mop-page-layout {
		grid-template-columns: minmax(0, 1fr);
	}

	#mo-category .mop-page-layout > .moh2-sidebar {
		width: 100%;
		padding: 0;
		border-left: 0;
	}
}

@media (max-width: 760px) {
	#mo-category .mop-inline-search {
		width: 100%;
		min-width: 0;
	}

	#mo-category .mop-archive-mast .moc-category-mast__row,
	#mo-category .mop-page-mast .moc-category-mast__row {
		display: block;
	}

	#mo-category .mop-page-band {
		padding-top: 28px;
	}

	#mo-category .mop-page-body {
		font-size: 17px;
		line-height: 1.7;
	}

	#mo-category .mop-page-campaign {
		margin-bottom: 26px;
	}

	#mo-category .mop-empty-state {
		padding: 28px 20px;
	}

	#mo-category .mop-pagination {
		flex-wrap: wrap;
	}

	#mo-category .mop-pagination .page-numbers {
		min-width: 40px;
		height: 40px;
	}

	#mo-category .mop-404-hero {
		padding: 52px 0 58px;
	}

	#mo-category .mop-404-latest {
		padding: 38px 0 46px;
	}
}