/*
Theme Name: Andrei Saguna
Theme URI: 
Author: Marketos
Author URI: 
Description: Universitatea „Andrei Șaguna” este prima universitate privată din Dobrogea, acreditată ARACIS și parte a Sistemului Național de Învățământ.
Requires at least: 7.1
Tested up to: 7.1
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: andrei-saguna
Tags: one-column, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, block-patterns, rtl-language-support, sticky-post, threaded-comments, translation-ready, wide-blocks, block-styles, style-variations, accessibility-ready, blog, portfolio, news

/*
 * This is the theme's real, hand-edited stylesheet and is always enqueued directly
 * (see functions.php) — there is no build step and no separate style.min.css in use.
 */

/*
 * Disable WordPress core's automatic block-gap fallback margin between
 * stacked blocks inside constrained-layout containers. Core always emits
 * `:root :where(.is-layout-constrained) > * { margin-block-start: 1.2rem; }`
 * as part of its global styles output — there is no theme.json setting to
 * turn it off, so it has to be zeroed out here instead. Spacing between
 * blocks is handled explicitly (blockGap / margin) where it's wanted.
 */
:root :where(.is-layout-constrained) > * {
	margin-block-start: 0 !important;
}

/*
 * Same core fallback gap, but for the top-level site sections themselves:
 * `:where(.wp-site-blocks) > * { margin-block-start: 1.2rem; margin-block-end: 0; }`
 * Zeroed for the same reason — header/main/footer spacing is handled
 * explicitly, not by this implicit default.
 */
:where(.wp-site-blocks) > * {
	margin-block-start: 0 !important;
}

/*
 * Same core fallback gap again, but for `.site-hero-stack` (the wrapper
 * templates/front-page.html puts around header+main so the hero-overlay
 * header's "position: absolute; top: 0" resolves against it — see that
 * rule further down). It uses the DEFAULT "flow" layout, a different core
 * rule (`:root :where(.is-layout-flow) > * { margin-block-start: 1.2rem; }`)
 * than the two already reset above, so it needed its own reset: without
 * this, <main> (the wrapper's second child, right after the position:absolute
 * <header> that contributes no flow height) was getting pushed down by
 * 1.2rem, leaving a visible gap of the page's own background color between
 * the announcement bar and the header/hero image actually starting.
 */
.site-hero-stack > * {
	margin-block-start: 0 !important;
}

/*
 * Core auto-constrains any non-full/non-wide/non-left/non-right block
 * inside a constrained layout to the content-size container:
 * `.is-layout-constrained > :where(:not(.alignleft):not(.alignright):not(.alignfull)) { max-width: var(--wp--style--global--content-size); }`
 * Default (no-align) blocks now manage their own width/max-width and
 * padding directly (block-level, not an automatic site-wide cap), so that
 * default is removed for them. `.alignwide` is explicitly excluded here so
 * core's own `.alignwide { max-width: var(--wp--style--global--wide-size); }`
 * rule keeps working — the header and footer rows rely on align="wide" for
 * their internal container width, and this override previously beat that
 * rule too (an !important always wins regardless of selector specificity).
 */
:where(.is-layout-constrained) > :where(:not(.alignleft):not(.alignright):not(.alignfull):not(.alignwide)) {
	max-width: none !important;
}

/*
 * Link styles
 * https://github.com/WordPress/gutenberg/issues/42319
 */
a {
	text-decoration-thickness: 1px !important;
	text-underline-offset: .1em;
}

/* Focus styles */
:where(.wp-site-blocks *:focus) {
	outline-width: 2px;
	outline-style: solid;
}

/* Increase the bottom margin on submenus, so that the outline is visible. */
.wp-block-navigation .wp-block-navigation-submenu .wp-block-navigation-item:not(:last-child) {
	margin-bottom: 3px;
}

/* Increase the outline offset on the parent menu items, so that the outline does not touch the text. */
.wp-block-navigation .wp-block-navigation-item .wp-block-navigation-item__content {
	outline-offset: 4px;
}

/* Remove outline offset from the submenus, otherwise the outline is visible outside the submenu container. */
.wp-block-navigation .wp-block-navigation-item ul.wp-block-navigation__submenu-container .wp-block-navigation-item__content {
	outline-offset: 0;
}

/* Links and buttons: no focus outline, no mobile tap-highlight flash. */
a,
button,
.wp-element-button,
.wp-block-navigation-item__content {
	-webkit-tap-highlight-color: transparent;
}

a:focus,
a:focus-visible,
button:focus,
button:focus-visible,
.wp-element-button:focus,
.wp-element-button:focus-visible,
.wp-block-navigation-item__content:focus,
.wp-block-navigation-item__content:focus-visible {
	outline: none !important;
}

/*
 * Progressive enhancement to reduce widows and orphans
 * https://github.com/WordPress/gutenberg/issues/55190
 */
h1, h2, h3, h4, h5, h6, blockquote, caption, figcaption, p {
	text-wrap: pretty;
}

/*
 * Change the position of the more block on the front, by making it a block level element.
 * https://github.com/WordPress/gutenberg/issues/65934
*/
.more-link {
	display: block;
}

/*
 * Prevents unnecessary scrollbars while handling long lines of preformatted text.
 * https://core.trac.wordpress.org/ticket/63875
 */
:where(pre) {
	overflow-x: auto;
}

/*
 * Responsive heading scale: each level steps down to the next level's size
 * on tablet/mobile. H5 has no smaller step, so it is unaffected.
 */
@media (max-width: 1024px) {
	h1, .wp-block-heading:where(h1), .has-h-1-font-size {
		font-size: var(--wp--preset--font-size--h-2) !important;
		line-height: 1.15;
		letter-spacing: normal;
	}
	h2, .wp-block-heading:where(h2), .has-h-2-font-size {
		font-size: var(--wp--preset--font-size--h-3) !important;
		line-height: 1.2;
		letter-spacing: 0.8px;
	}
	h3, .wp-block-heading:where(h3), .has-h-3-font-size {
		font-size: var(--wp--preset--font-size--h-4) !important;
		line-height: 1.2;
		letter-spacing: 0.64px;
	}
	h4, .wp-block-heading:where(h4), .has-h-4-font-size {
		font-size: calc(var(--wp--preset--font-size--h-5) + 4px) !important;
		line-height: 1.2;
		letter-spacing: 0.4px;
	}
}

/*
 * Mobile heading scale (<768px): steps down further, measured against the
 * desktop sizes. H1 -> H3 size, H2 -> H4 size, H4 -> 22px. H3 keeps its
 * tablet size and H5 is unaffected.
 */
@media (max-width: 767px) {
	h1, .wp-block-heading:where(h1), .has-h-1-font-size {
		font-size: var(--wp--preset--font-size--h-3) !important;
		line-height: 1.2;
		letter-spacing: 0.64px;
	}
	h2, .wp-block-heading:where(h2), .has-h-2-font-size {
		font-size: var(--wp--preset--font-size--h-4) !important;
		line-height: 1.2;
		letter-spacing: 0.4px;
	}
	h4, .wp-block-heading:where(h4), .has-h-4-font-size {
		font-size: 22px !important;
		line-height: 1.2;
		letter-spacing: 0.4px;
	}
}

/*
 * === site header ===
 * One header for every page. It switches to a transparent, light-text
 * overlay automatically when the page has a Hero section: functions.php
 * detects a block carrying the "is-page-hero" class and adds a
 * `has-page-hero` class to <body>; everything below keys off that.
 */
.site-topbar-row {
	border-bottom: 1px solid var(--wp--preset--color--neutral-100);
}

/* The topbar row has a single child (the synced topbar-content pattern); make it
 * span the full row width so its own space-between can push contact info and
 * the link list apart, instead of both shrinking together on the left. */
.site-topbar-row > .site-topbar-content {
	width: 100%;
}

.site-topbar-row a {
	color: var(--wp--preset--color--accent-500);
	text-decoration: none;
}

.site-logo-lockup .wp-block-site-title a {
	text-decoration: none;
}

/*
 * The lockup itself is the real link now (logo + title + tagline together,
 * not just core/site-title's own inner <a> the rule above was written for)
 * — plain, no underline at all, not even on hover (by request).
 */
.site-logo-lockup,
.site-logo-lockup:hover {
	text-decoration: none;
}

/* Footer links: no underline by default, underline on hover (matches nav convention). */
.site-footer a {
	text-decoration: none;
}

.site-footer a:hover {
	text-decoration: underline;
	text-decoration-color: currentColor;
	text-underline-offset: 4px;
}

.wp-block-navigation-item__content {
	padding: var(--wp--preset--spacing--2) var(--wp--preset--spacing--3);
	color: var(--wp--preset--color--neutral-900);
	text-decoration: none;
	transition: color 0.15s ease, transform 0.15s ease;
}

.wp-block-navigation-item__content:hover {
	color: var(--wp--preset--color--accent-500);
	text-decoration: underline;
	text-decoration-color: currentColor;
	text-underline-offset: 4px;
	transform: translateY(-2px);
}

@media (prefers-reduced-motion: reduce) {
	.wp-block-navigation-item__content {
		transition: none;
	}

	.wp-block-navigation-item__content:hover {
		transform: none;
	}
}

.admitere-button .wp-element-button {
	white-space: nowrap;
}

/* Force the nav into hamburger/overlay mode up to 1024px (core's own breakpoint is 600px). */
@media (max-width: 1024px) {
	.wp-block-navigation__responsive-container-open:not(.always-shown) {
		display: flex !important;
	}

	.wp-block-navigation__responsive-container:not(.hidden-by-default):not(.is-menu-open) {
		display: none !important;
	}
}

/* Modal padding: match the header's own spacing/4, instead of core's default
 * root-padding-based clamp() on every side. */
.wp-block-navigation__responsive-container.is-menu-open:not(.disable-default-overlay) {
	padding: var(--wp--preset--spacing--4) !important;
}

/* Overlay layout: let the content column span the full modal height so the links
 * group (below) can be pushed to the bottom, and left-align everything (core
 * defaults to right-aligned here because the desktop nav uses justifyContent: right). */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-close,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-dialog {
	height: 100%;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
	min-height: 100%;
	align-items: flex-start !important;
}

.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container,
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
	align-items: flex-start !important;
}

/* Contact bar + admitere button live only inline (desktop/tablet); duplicated inside the
 * mobile nav modal below via the same synced patterns (refs 23 + 24) so editing either
 * copy updates both. The button stays with the nav links at the top of the modal;
 * the links group is pushed to the bottom via margin-top: auto. */
.site-nav-mobile-button,
.site-nav-mobile-links {
	width: 100%;
}

.site-nav-mobile-links {
	margin-top: auto;
}

@media (min-width: 768px) {
	.site-nav-mobile-button,
	.site-nav-mobile-links {
		display: none !important;
	}
}

@media (max-width: 767px) {
	.site-topbar-row {
		display: none !important;
	}

	.site-nav-cluster > .wp-block-buttons {
		display: none !important;
	}
}

@media (max-width: 600px) {
	.site-topbar-row {
		row-gap: var(--wp--preset--spacing--2);
	}

	.site-topbar-contact,
	.site-topbar-links {
		column-gap: var(--wp--preset--spacing--4);
		row-gap: var(--wp--preset--spacing--1);
	}

	.site-header-row {
		align-items: center;
	}

	.site-logo-lockup {
		min-width: 0;
	}

	.site-nav-cluster {
		column-gap: var(--wp--preset--spacing--3);
		flex-shrink: 0;
		margin-left: auto;
	}
}

@media (max-width: 767px) {
	.site-logo-lockup h5 {
		font-size: 14px !important;
	}

	.site-logo-lockup .wp-block-site-tagline {
		font-size: 12px !important;
	}
}

/*
 * === front page: announcement bar above the hero+header combo ===
 * templates/front-page.html wraps the header + main content in this group
 * so the hero-overlay header's "position: absolute; top: 0" below resolves
 * against THIS wrapper's own top edge, not the viewport's. Since the
 * announcement bar (andrei-saguna/announcement-bar) sits in normal flow
 * right before this wrapper, the wrapper's top edge — and so the header —
 * naturally sits right below the bar, without changing anything about how
 * the header overlays the hero photo *within* that space. If the bar is
 * absent (not placed, or dismissed and JS-hidden), the wrapper's top edge
 * simply moves back up to the very top of the page on its own — no JS
 * height-measuring or body class needed to coordinate the two.
 */
.site-hero-stack {
	position: relative;
}

/*
 * === hero page layout (body.has-page-hero / body.has-page-solid-hero) ===
 * When the page's content starts with a Hero block — either variant, image
 * (has-page-hero) or solid/text (has-page-solid-hero) — drop the default
 * page-title/featured-image area so the Hero's own heading is the only
 * title on the page. (main/page-content-wrap no longer carry their own top
 * spacing, so nothing to zero out there anymore.) Only has-page-hero also
 * flips the header transparent — see andrei_saguna_page_has_solid_hero() in
 * functions.php for why the solid variant deliberately doesn't.
 */
body.has-page-hero .wp-block-post-featured-image,
body.has-page-hero .wp-block-post-title,
body.has-page-solid-hero .wp-block-post-featured-image,
body.has-page-solid-hero .wp-block-post-title {
	display: none;
}

/*
 * Plain white bar on every non-hero page — reinstated by request (this had
 * been removed twice before: once as the block's own "backgroundColor"
 * attribute, once as this same plain rule). The hero-overlay rule right
 * below still wins on hero pages via !important.
 *
 * "position: relative" makes this the positioned ancestor for the mega
 * menu's dropdown panels (andrei-saguna/mega-menu-item), so a panel's own
 * "left: 50%" centers against the FULL header width instead of against
 * whichever small nav trigger happens to have opened it — on hero pages,
 * .site-header is already "position: absolute" (below), which still works
 * equally well as a positioning context.
 */
.site-header {
	position: relative;
	background-color: var(--wp--preset--color--base-white);
}

/*
 * === hero overlay header (body.has-page-hero) ===
 */
body.has-page-hero .site-header {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	z-index: 20;
	background: transparent !important;
}

body.has-page-hero .site-topbar-row a {
	color: var(--wp--preset--color--neutral-300) !important;
}

body.has-page-hero .site-logo-lockup h5,
body.has-page-hero .wp-block-site-tagline,
body.has-page-hero .wp-block-navigation .wp-block-navigation__responsive-container-open {
	color: var(--wp--preset--color--base-white) !important;
}

body.has-page-hero .wp-block-navigation-item__content {
	color: var(--wp--preset--color--base-white) !important;
}

body.has-page-hero .wp-block-navigation-item__content:hover {
	color: var(--wp--preset--color--neutral-50) !important;
	text-decoration: underline;
	text-decoration-color: currentColor;
	text-underline-offset: 4px;
	transform: translateY(-2px);
}

/* Admitere button stays solid navy in both modes — not affected by the overrides above. */

/* -----------------------------------------------------------------------
 * Design-system button styles (Big/Small Primary, Secondary, Outline).
 * Base color/spacing/border live in theme.json (styles.blocks.core/button.variations)
 * so they show up correctly in the editor. This block only adds what theme.json's
 * variation schema can't express: flex centering, a fixed height for the "Big" sizes,
 * and the hover/disabled states — all still driven by theme.json color variables.
 * Disabled state: add "is-disabled" as an Additional CSS Class on the button.
 * ------------------------------------------------------------------- */
.wp-block-button.is-style-big-primary .wp-block-button__link,
.wp-block-button.is-style-small-primary .wp-block-button__link,
.wp-block-button.is-style-big-secondary .wp-block-button__link,
.wp-block-button.is-style-small-secondary .wp-block-button__link,
.wp-block-button.is-style-big-outline .wp-block-button__link,
.wp-block-button.is-style-small-outline .wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
}

.wp-block-button.is-style-big-primary .wp-block-button__link {
	gap: var(--wp--preset--spacing--2);
}

.wp-block-button.is-style-big-secondary .wp-block-button__link,
.wp-block-button.is-style-big-outline .wp-block-button__link {
	height: 44px;
}

.wp-block-button.is-style-big-primary .wp-block-button__link:hover,
.wp-block-button.is-style-small-primary .wp-block-button__link:hover {
	background-color: var(--wp--preset--color--accent-600);
}

.wp-block-button.is-style-big-secondary .wp-block-button__link:hover,
.wp-block-button.is-style-small-secondary .wp-block-button__link:hover {
	background-color: var(--wp--preset--color--surface-subtle);
}

.wp-block-button.is-style-big-outline .wp-block-button__link:hover,
.wp-block-button.is-style-small-outline .wp-block-button__link:hover {
	color: var(--wp--preset--color--neutral-900);
	background-color: var(--wp--preset--color--base-white);
	border-color: var(--wp--preset--color--neutral-900);
}

.wp-block-button.is-style-big-primary.is-disabled .wp-block-button__link,
.wp-block-button.is-style-small-primary.is-disabled .wp-block-button__link {
	color: var(--wp--preset--color--disabled-text);
	background-color: var(--wp--preset--color--disabled-surface);
}

.wp-block-button.is-style-big-secondary.is-disabled .wp-block-button__link,
.wp-block-button.is-style-small-secondary.is-disabled .wp-block-button__link {
	color: var(--wp--preset--color--disabled-text);
	background-color: var(--wp--preset--color--disabled-surface);
	border-color: var(--wp--preset--color--border-subtle);
}

.wp-block-button.is-style-big-outline.is-disabled .wp-block-button__link,
.wp-block-button.is-style-small-outline.is-disabled .wp-block-button__link {
	color: var(--wp--preset--color--disabled-text);
	border-color: var(--wp--preset--color--border-subtle-on-dark);
}

/*
 * Footer intro (title + tagline + description): constrained to 40% of the
 * footer's content width on desktop only, full width on mobile. Needs
 * !important to win over the site-wide "unconstrained default blocks"
 * reset above, which itself uses !important.
 */
.site-footer .footer-intro {
	max-width: 40% !important;
	margin-left: 0 !important;
	margin-right: auto !important;
}

@media (max-width: 767px) {
	.site-footer .footer-intro {
		max-width: 100% !important;
	}
}