/*
Theme Name: Qirat
Theme URI: https://qirat.goldyza.com
Update URI: https://qirat.goldyza.com/private-theme/qirat
Author: Qirat
Author URI: https://qirat.goldyza.com/
Description: Lightweight, accessible WordPress block theme with native Site Editor navigation, responsive templates and an optional high-contrast color scheme.
Version: 1.1.1
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: qirat
Tags: block-patterns, full-site-editing, wide-blocks, editor-style, rtl-language-support
*/

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

html {
	color-scheme: light;
	text-size-adjust: 100%;
}

body {
	min-width: 0;
	overflow-wrap: break-word;
}

img,
svg,
video,
canvas,
iframe {
	max-width: 100%;
}

img,
video {
	height: auto;
}

:where(a, button, input, textarea, select):focus-visible {
	outline: 3px solid var(--wp--preset--color--accent);
	outline-offset: 3px;
}

.qirat-header,
.qirat-footer {
	background-color: var(--wp--preset--color--base-alt);
}

.qirat-header {
	border-block-end: 1px solid var(--wp--preset--color--border);
}

.qirat-header__inner,
.qirat-brand,
.qirat-controls {
	min-width: 0;
}

.qirat-brand {
	flex: 1 1 auto;
}

.qirat-brand .wp-block-site-logo {
	flex: 0 0 auto;
}

.qirat-brand .wp-block-site-logo img {
	display: block;
	max-height: 4rem;
	object-fit: contain;
}

.qirat-brand .wp-block-site-title {
	min-width: 0;
	overflow-wrap: anywhere;
}

.qirat-brand .wp-block-site-title a,
.qirat-footer .wp-block-site-title a {
	color: var(--wp--preset--color--contrast);
	text-decoration: none;
}

.qirat-controls {
	flex: 0 1 auto;
}

.qirat-header .wp-block-navigation {
	min-width: 0;
}

.qirat-header .wp-block-navigation__responsive-container.is-menu-open {
	box-sizing: border-box;
	color: var(--wp--preset--color--contrast);
	padding: var(--wp--preset--spacing--50);
}

.qirat-dark-toggle {
	align-items: center;
	background: transparent;
	border: 0;
	border-radius: 0.5rem;
	color: var(--wp--preset--color--contrast);
	cursor: pointer;
	display: inline-flex;
	flex: 0 0 auto;
	height: 2.75rem;
	justify-content: center;
	padding: 0;
	width: 2.75rem;
}

.qirat-dark-toggle:hover {
	background-color: var(--wp--preset--color--base);
	box-shadow: inset 0 0 0 1px var(--wp--preset--color--border);
	color: var(--wp--preset--color--primary);
}

.qirat-dark-toggle svg {
	fill: currentColor;
	height: 1.25rem;
	width: 1.25rem;
}

.qirat-icon-sun,
html.qirat-dark .qirat-icon-moon {
	display: none;
}

html.qirat-dark .qirat-icon-sun {
	display: block;
}

.qirat-main {
	min-height: 55svh;
}

.qirat-post-grid {
	display: grid;
	gap: var(--wp--preset--spacing--50);
	grid-template-columns: repeat(auto-fit, minmax(min(100%, 18rem), 1fr));
	list-style: none;
	padding: 0;
}

.qirat-post-card {
	background-color: var(--wp--preset--color--base-alt);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 0.75rem;
	height: 100%;
	min-width: 0;
}

.qirat-post-card > :first-child {
	margin-block-start: 0;
}

.qirat-post-card > :last-child {
	margin-block-end: 0;
}

.qirat-post-meta,
.qirat-post-navigation,
.wp-block-query-pagination {
	flex-wrap: wrap;
}

.qirat-post-meta {
	color: var(--wp--preset--color--contrast-muted);
}

.qirat-post-content :where(pre, .wp-block-table) {
	max-width: 100%;
	overflow-x: auto;
}

.qirat-post-content :where(input, textarea, select),
.wp-block-search__input {
	background-color: var(--wp--preset--color--base);
	border: 1px solid var(--wp--preset--color--border);
	color: var(--wp--preset--color--contrast);
	max-width: 100%;
}

.qirat-footer {
	border-block-start: 1px solid var(--wp--preset--color--border);
}

html.qirat-dark {
	color-scheme: dark;
}

html.qirat-dark,
html.qirat-dark body {
	--wp--preset--color--primary: #A5B4FC;
	--wp--preset--color--primary-light: #C7D2FE;
	--wp--preset--color--accent: #5EEAD4;
	--wp--preset--color--base: #0B1020;
	--wp--preset--color--base-alt: #121A2A;
	--wp--preset--color--contrast: #F8FAFC;
	--wp--preset--color--contrast-muted: #CBD5E1;
	--wp--preset--color--border: #64748B;
}

html.qirat-dark .qirat-header,
html.qirat-dark .qirat-footer,
html.qirat-dark .qirat-post-card {
	background-color: var(--wp--preset--color--base-alt);
	background-image: none;
	border-color: var(--wp--preset--color--border);
}

html.qirat-dark .qirat-header :where(a, .qirat-dark-toggle) {
	color: var(--wp--preset--color--contrast);
}

html.qirat-dark .qirat-header :where(a:hover, a:focus-visible, .qirat-dark-toggle:hover) {
	color: var(--wp--preset--color--primary);
}

@media (max-width: 600px) {
	.qirat-header__inner {
		gap: var(--wp--preset--spacing--20);
		padding-block: var(--wp--preset--spacing--20) !important;
	}

	.qirat-brand {
		flex: 1 1 10rem;
		gap: var(--wp--preset--spacing--20) !important;
	}

	.qirat-controls {
		gap: var(--wp--preset--spacing--20) !important;
		margin-inline-start: auto;
	}

	.qirat-brand .wp-block-site-title {
		font-size: var(--wp--preset--font-size--medium) !important;
	}

	.qirat-post-navigation {
		align-items: stretch !important;
		flex-direction: column;
	}
}

@media (max-width: 360px) {
	.qirat-header__inner {
		align-items: flex-start !important;
	}

	.qirat-brand {
		flex-basis: calc(100% - 3.5rem);
	}

	.qirat-controls {
		flex-basis: 100%;
		justify-content: flex-end;
	}
}

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
	}
}
