/*
Theme Name: Random Fix OS
Theme URI: https://randomfix.com
Author: Random Fix
Author URI: https://randomfix.com
Description: A dark-mode-first WordPress block theme for Random Fix, built for practical troubleshooting notes, repair logs, and field-tested tech posts.
Requires at least: 6.4
Tested up to: 6.6
Requires PHP: 7.4
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: random-fix-os
Tags: blog, block-patterns, full-site-editing, dark, one-column, custom-logo
*/

:root {
	--rf-glow: 0 0 28px rgba(0, 194, 255, 0.18);
	--rf-border: color-mix(in srgb, var(--wp--preset--color--line) 82%, transparent);
}

* {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
}

body {
	background:
		linear-gradient(180deg, rgba(0, 194, 255, 0.04), transparent 24rem),
		var(--wp--preset--color--base);
}

a {
	text-decoration-thickness: 0.08em;
	text-underline-offset: 0.18em;
}

a:hover {
	color: var(--wp--preset--color--accent);
}

code,
kbd,
pre,
samp {
	font-family: var(--wp--preset--font-family--mono);
}

pre,
.wp-block-code {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--rf-border);
	border-radius: 8px;
	box-shadow: var(--rf-glow);
	color: var(--wp--preset--color--foreground);
	overflow-x: auto;
}

.wp-site-blocks {
	min-height: 100vh;
}

.rf-shell {
	border-inline: 1px solid rgba(113, 128, 150, 0.18);
}

.rf-header {
	backdrop-filter: blur(18px);
	background: rgba(7, 12, 20, 0.82);
	border-bottom: 1px solid var(--rf-border);
	position: sticky;
	top: 0;
	z-index: 20;
}

.admin-bar .rf-header {
	top: 32px;
}

.rf-logo {
	display: inline-flex;
	line-height: 0;
	text-decoration: none;
}

.rf-logo svg,
.rf-brand-mark img {
	display: block;
	height: auto;
	max-width: 220px;
}

.rf-nav a {
	font-size: 0.88rem;
	font-weight: 700;
	letter-spacing: 0.02em;
	text-decoration: none;
	text-transform: uppercase;
}

.rf-hero {
	border-bottom: 1px solid var(--rf-border);
	position: relative;
}

.rf-hero::before {
	background-image:
		linear-gradient(rgba(0, 194, 255, 0.08) 1px, transparent 1px),
		linear-gradient(90deg, rgba(0, 194, 255, 0.08) 1px, transparent 1px);
	background-size: 44px 44px;
	content: "";
	inset: 0;
	mask-image: linear-gradient(180deg, #000, transparent 72%);
	opacity: 0.4;
	pointer-events: none;
	position: absolute;
}

.rf-hero > * {
	position: relative;
}

.rf-kicker {
	color: var(--wp--preset--color--accent);
	font-family: var(--wp--preset--font-family--mono);
	font-size: 0.78rem;
	font-weight: 700;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.rf-command {
	background: rgba(12, 19, 32, 0.82);
	border: 1px solid var(--rf-border);
	border-radius: 8px;
	box-shadow: var(--rf-glow);
}

.rf-command code {
	color: var(--wp--preset--color--accent-soft);
}

.rf-card {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--rf-border);
	border-radius: 8px;
	box-shadow: 0 18px 50px rgba(0, 0, 0, 0.28);
}

.rf-post-card {
	background: rgba(12, 19, 32, 0.68);
	border: 1px solid var(--rf-border);
	border-radius: 8px;
	padding: clamp(1rem, 2vw, 1.5rem);
}

.rf-post-card:hover {
	border-color: rgba(0, 194, 255, 0.48);
	box-shadow: var(--rf-glow);
}

.rf-post-card .wp-block-post-title a {
	text-decoration: none;
}

.rf-meta,
.wp-block-post-date,
.wp-block-post-terms {
	color: var(--wp--preset--color--muted);
	font-family: var(--wp--preset--font-family--mono);
	font-size: var(--wp--preset--font-size--small);
}

.rf-status-list {
	list-style: none;
	padding-left: 0;
}

.rf-status-list li {
	border-bottom: 1px solid var(--rf-border);
	padding-block: 0.72rem;
}

.rf-status-list li:last-child {
	border-bottom: 0;
}

.wp-block-search__input,
.wp-block-post-comments-form input:not([type="submit"]),
.wp-block-post-comments-form textarea {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--rf-border);
	border-radius: 6px;
	color: var(--wp--preset--color--foreground);
}

.wp-block-search__button,
.wp-block-button__link,
input[type="submit"] {
	border-radius: 6px;
	font-weight: 800;
}

.wp-block-separator {
	border-color: var(--rf-border);
}

.wp-block-quote {
	border-left: 3px solid var(--wp--preset--color--accent);
	color: var(--wp--preset--color--foreground);
	padding-left: 1rem;
}

.wp-block-table table {
	border-color: var(--rf-border);
}

.wp-block-table td,
.wp-block-table th {
	border-color: var(--rf-border);
}

.rf-footer {
	border-top: 1px solid var(--rf-border);
}

@media (max-width: 782px) {
	.admin-bar .rf-header {
		top: 46px;
	}

	.rf-logo svg,
	.rf-brand-mark img {
		max-width: 185px;
	}
}