/*
Theme Name: Anchored
Theme URI: https://wordpress.anchorhub.co.za
Author: AnchorHub
Description: A nautical dark-teal theme for the Venter family's "Anchored" Bible study blog, built as a child of Twenty Twenty-Five and styled to match the AnchorHub login screen (deep navy backdrop, teal/blue glow, glass card panels).
Template: twentytwentyfive
Requires at least: 6.7
Requires PHP: 7.2
Version: 1.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: anchored
*/

/* ---------------------------------------------------------------------
   Anchored — matches the AnchorHub Authentik login screen's palette:
   deep navy backdrop with teal/blue glow, glass card panels, teal CTAs.
   Most color/typography work is done via theme.json; this file handles
   the things global styles can't reach (the site-title wordmark, the
   floating "card" content panel, form controls, selection color).
   --------------------------------------------------------------------- */

html {
	background: #071019 !important;
}

body {
	background:
		radial-gradient(1200px 800px at 20% 12%, rgba(45, 212, 191, 0.20) 0%, rgba(45, 212, 191, 0) 55%),
		radial-gradient(1000px 750px at 85% 85%, rgba(56, 189, 248, 0.16) 0%, rgba(56, 189, 248, 0) 55%),
		linear-gradient(160deg, #050c14 0%, #0a1826 45%, #071019 100%) !important;
	background-attachment: fixed !important;
	min-height: 100vh;
}

/* Text selection, matching the login screen's teal highlight */
::selection {
	background: rgba(45, 212, 191, 0.35);
	color: #e7f0f5;
}

/* ---- The floating "card" that holds the page's actual content ----
   Mirrors .pf-c-login__main on the Authentik login screen: a soft
   glass panel sitting on top of the gradient backdrop. */
main {
	background: linear-gradient(180deg, rgba(20, 35, 48, 0.78), rgba(10, 20, 30, 0.86)) !important;
	border: 1px solid rgba(148, 199, 199, 0.18) !important;
	border-radius: 20px !important;
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	box-shadow:
		0 30px 80px rgba(0, 0, 0, 0.45),
		0 0 60px rgba(45, 212, 191, 0.08) !important;
	margin-top: clamp(20px, 4vw, 48px) !important;
	margin-bottom: clamp(20px, 4vw, 48px) !important;
	padding-top: clamp(24px, 5vw, 56px) !important;
	padding-bottom: clamp(24px, 5vw, 56px) !important;
	overflow: hidden;
}

/* ---- Site title wordmark, gradient-text like the "AnchorHub" mark
   on the login screen ---- */
.wp-block-site-title,
.wp-block-site-title a {
	background: linear-gradient(90deg, #eaf6f4, #2dd4bf 60%, #38bdf8);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent !important;
	-webkit-text-fill-color: transparent;
	text-decoration: none !important;
}

.wp-block-site-tagline {
	color: #8fa6b3 !important;
	opacity: 1 !important;
}

/* ---- Navigation ---- */
.wp-block-navigation-item__content {
	color: #cfe3e8 !important;
}
.wp-block-navigation-item__content:hover {
	color: #2dd4bf !important;
}

/* ---- Links: teal, like the login screen's links ---- */
a {
	color: #2dd4bf;
}
a:hover {
	color: #38bdf8;
}

/* ---- Buttons: teal-to-blue gradient CTA, same as the login screen's
   primary "Sign in" button ---- */
.wp-block-button__link {
	background: linear-gradient(90deg, #1fb8a6, #34a6d6) !important;
	color: #04141a !important;
	font-weight: 700 !important;
	border: none !important;
	border-radius: 12px !important;
	box-shadow: 0 14px 30px rgba(45, 212, 191, 0.28) !important;
	transition: filter 0.15s ease;
}
.wp-block-button__link:hover {
	filter: brightness(1.08);
	color: #04141a !important;
}
.wp-block-button.is-style-outline .wp-block-button__link {
	background: rgba(255, 255, 255, 0.05) !important;
	color: #cfe3e8 !important;
	border: 1px solid rgba(255, 255, 255, 0.14) !important;
}

/* ---- Form controls (comments, search) — glassy inputs matching the
   login form's fields ---- */
input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]),
textarea,
.wp-block-search__input {
	background: rgba(255, 255, 255, 0.05) !important;
	border: 1px solid rgba(255, 255, 255, 0.14) !important;
	color: #cfe3e8 !important;
	border-radius: 11px !important;
}
input::placeholder,
textarea::placeholder {
	color: #5b7684 !important;
}
input:not([type="submit"]):focus,
textarea:focus,
.wp-block-search__input:focus {
	border-color: rgba(45, 212, 191, 0.65) !important;
	box-shadow: 0 0 0 3px rgba(45, 212, 191, 0.16) !important;
	outline: none;
}

/* ---- Post titles / entry content links stay legible on the card ---- */
.wp-block-post-title a {
	color: #e7f0f5 !important;
	text-decoration: none;
}
.wp-block-post-title a:hover {
	color: #2dd4bf !important;
}

/* ---- Quote left-border and separators pick up the subtle teal-grey
   border tone used throughout the login screen ---- */
.wp-block-quote,
hr,
.wp-block-separator {
	border-color: rgba(148, 199, 199, 0.28) !important;
}

/* Small accessibility niceties from the parent theme, kept here since
   this stylesheet fully replaces the parent's on the frontend. */
a {
	text-decoration-thickness: 1px;
	text-underline-offset: .1em;
}
:where(.wp-site-blocks *:focus) {
	outline-width: 2px;
	outline-style: solid;
	outline-color: #2dd4bf;
}
h1, h2, h3, h4, h5, h6, blockquote, caption, figcaption, p {
	text-wrap: pretty;
}