/**
 * Rajgir Parent Theme
 *
 * Layout CSS — Global Footer
 *
 * Canonical path:
 * assets/css/layouts/footer.css
 *
 * Primary markup owner:
 * template-parts/footer/site-footer.php
 *
 * Document shell owner:
 * footer.php
 *
 * Responsibility:
 * - Global footer layout
 * - Footer structure
 * - Footer identity layout
 * - Footer navigation placement
 * - Footer links layout
 * - Footer bottom/copyright layout
 * - Responsive footer presentation
 *
 * Does NOT own:
 * - Business logic
 * - Authentication
 * - Authorization
 * - Database operations
 * - Application workflows
 * - Navigation data authority
 * - Copyright/business policy authority
 *
 * @package Rajgir
 */

defined( 'ABSPATH' ) || exit;


/* ==========================================================================
   1. FOOTER FOUNDATION
   ========================================================================== */

.rg-footer {
	width: 100%;

	margin: 0;

	padding:
		var(--rajgir-space-footer-block)
		0;

	background:
		var(--rajgir-color-footer-background);

	color:
		var(--rajgir-color-footer-text);

	border-top:
		1px solid var(--rajgir-color-footer-border);

	box-sizing: border-box;
}


/* ==========================================================================
   2. FOOTER CHILD BOX SIZING
   ========================================================================== */

.rg-footer *,
.rg-footer *::before,
.rg-footer *::after {
	box-sizing: border-box;
}


/* ==========================================================================
   3. FOOTER INNER
   ========================================================================== */

.rg-footer__inner {
	width: 100%;

	max-width: 100%;
}


/*
 * Global container width and horizontal padding remain owned by:
 *
 * assets/css/layouts/container.css
 */


/* ==========================================================================
   4. FOOTER MAIN
   ========================================================================== */

.rg-footer__main {
	display: grid;

	grid-template-columns:
		minmax(0, 1fr);

	gap:
		var(--rajgir-space-footer-main-gap);

	width: 100%;
}


/* ==========================================================================
   5. FOOTER IDENTITY
   ========================================================================== */

.rg-footer__identity {
	min-width: 0;
}


/* ==========================================================================
   6. FOOTER BRAND
   ========================================================================== */

.rg-footer__brand {
	display: inline-flex;

	align-items: center;

	gap:
		var(--rajgir-space-brand-gap);

	max-width: 100%;

	color:
		var(--rajgir-color-footer-text);

	text-decoration: none;
}


/* ==========================================================================
   7. FOOTER BRAND MARK
   ========================================================================== */

.rg-footer__brand-mark {
	display: inline-flex;

	align-items: center;
	justify-content: center;

	flex:
		0 0 auto;

	width:
		var(--rajgir-brand-mark-size);

	height:
		var(--rajgir-brand-mark-size);

	border-radius:
		var(--rajgir-radius-brand-mark);

	background:
		var(--rajgir-color-brand-mark);
}


/* ==========================================================================
   8. FOOTER BRAND MARK INNER
   ========================================================================== */

.rg-footer__brand-mark-inner {
	display: block;

	width:
		var(--rajgir-brand-mark-inner-size);

	height:
		var(--rajgir-brand-mark-inner-size);

	border-radius:
		var(--rajgir-radius-brand-mark-inner);

	background:
		var(--rajgir-color-brand-mark-inner);
}


/* ==========================================================================
   9. FOOTER BRAND NAME
   ========================================================================== */

.rg-footer__brand-name {
	display: block;

	min-width: 0;

	color:
		var(--rajgir-color-footer-text);

	font-family:
		var(--rajgir-type-brand-font-family);

	font-size:
		var(--rajgir-type-brand-font-size);

	font-weight:
		var(--rajgir-type-brand-font-weight);

	line-height:
		var(--rajgir-type-brand-line-height);

	overflow-wrap:
		break-word;
}


/* ==========================================================================
   10. FOOTER BRAND FOCUS
   ========================================================================== */

.rg-footer__brand:focus-visible {
	outline:
		2px solid var(--rajgir-color-focus);

	outline-offset:
		3px;

	border-radius:
		var(--rajgir-radius-focus);
}


/* ==========================================================================
   11. FOOTER DESCRIPTION
   ========================================================================== */

.rg-footer__description {
	max-width:
		var(--rajgir-footer-description-max-width);

	margin:
		var(--rajgir-space-footer-description-gap)
		0
		0;

	color:
		var(--rajgir-color-footer-text-muted);

	font-family:
		var(--rajgir-font-family-body);

	font-size:
		var(--rajgir-font-size-small);

	line-height:
		var(--rajgir-line-height-small);

	overflow-wrap:
		break-word;
}


/* ==========================================================================
   12. FOOTER NAVIGATION
   ========================================================================== */

.rg-footer__navigation {
	min-width: 0;

	width: 100%;
}


/* ==========================================================================
   13. FOOTER NAVIGATION LIST
   ========================================================================== */

.rg-footer__navigation-list {
	display: flex;

	align-items: flex-start;

	flex-wrap: wrap;

	gap:
		var(--rajgir-space-footer-navigation-gap);

	margin: 0;

	padding: 0;

	list-style: none;
}


/* ==========================================================================
   14. FOOTER NAVIGATION ITEM
   ========================================================================== */

.rg-footer__navigation-list > li {
	margin: 0;

	padding: 0;
}


/* ==========================================================================
   15. FOOTER NAVIGATION LINK
   ========================================================================== */

.rg-footer__navigation-list a {
	display: inline-flex;

	align-items: center;

	min-height:
		var(--rajgir-control-min-height);

	color:
		var(--rajgir-color-footer-link);

	font-size:
		var(--rajgir-font-size-small);

	line-height:
		var(--rajgir-line-height-small);

	text-decoration: none;
}


/* ==========================================================================
   16. FOOTER NAVIGATION LINK — HOVER
   ========================================================================== */

.rg-footer__navigation-list a:hover {
	color:
		var(--rajgir-color-footer-link-hover);

	text-decoration:
		underline;

	text-underline-offset:
		0.15em;
}


/* ==========================================================================
   17. FOOTER NAVIGATION LINK — FOCUS
   ========================================================================== */

.rg-footer__navigation-list a:focus-visible {
	outline:
		2px solid var(--rajgir-color-focus);

	outline-offset:
		2px;

	border-radius:
		var(--rajgir-radius-focus);
}


/* ==========================================================================
   18. FOOTER LINKS
   ========================================================================== */

.rg-footer__links {
	width: 100%;

	margin-top:
		var(--rajgir-space-footer-links-gap);
}


/* ==========================================================================
   19. FOOTER SECONDARY NAVIGATION
   ========================================================================== */

.rg-footer__secondary-navigation {
	width: 100%;
}


/* ==========================================================================
   20. FOOTER SECONDARY LIST
   ========================================================================== */

.rg-footer__secondary-navigation ul {
	display: flex;

	align-items: center;

	flex-wrap: wrap;

	gap:
		var(--rajgir-space-footer-secondary-gap);

	margin: 0;

	padding: 0;

	list-style: none;
}


/* ==========================================================================
   21. FOOTER SECONDARY ITEM
   ========================================================================== */

.rg-footer__secondary-navigation li {
	margin: 0;

	padding: 0;
}


/* ==========================================================================
   22. FOOTER SECONDARY LINK
   ========================================================================== */

.rg-footer__secondary-navigation a {
	display: inline-flex;

	align-items: center;

	min-height:
		var(--rajgir-control-min-height);

	color:
		var(--rajgir-color-footer-link);

	font-size:
		var(--rajgir-font-size-small);

	line-height:
		var(--rajgir-line-height-small);

	text-decoration: none;
}


/* ==========================================================================
   23. FOOTER SECONDARY LINK — HOVER
   ========================================================================== */

.rg-footer__secondary-navigation a:hover {
	color:
		var(--rajgir-color-footer-link-hover);

	text-decoration:
		underline;

	text-underline-offset:
		0.15em;
}


/* ==========================================================================
   24. FOOTER SECONDARY LINK — FOCUS
   ========================================================================== */

.rg-footer__secondary-navigation a:focus-visible {
	outline:
		2px solid var(--rajgir-color-focus);

	outline-offset:
		2px;

	border-radius:
		var(--rajgir-radius-focus);
}


/* ==========================================================================
   25. FOOTER BOTTOM
   ========================================================================== */

.rg-footer__bottom {
	display: flex;

	align-items: center;

	justify-content: space-between;

	flex-wrap: wrap;

	gap:
		var(--rajgir-space-footer-bottom-gap);

	width: 100%;

	margin-top:
		var(--rajgir-space-footer-bottom-margin);

	padding-top:
		var(--rajgir-space-footer-bottom-padding);

	border-top:
		1px solid var(--rajgir-color-footer-border);
}


/* ==========================================================================
   26. FOOTER COPYRIGHT
   ========================================================================== */

.rg-footer__copyright {
	min-width: 0;

	color:
		var(--rajgir-color-footer-text-muted);

	font-size:
		var(--rajgir-font-size-small);

	line-height:
		var(--rajgir-line-height-small);

	overflow-wrap:
		break-word;
}


/* ==========================================================================
   27. FOOTER COPYRIGHT LINKS
   ========================================================================== */

.rg-footer__copyright a {
	color:
		var(--rajgir-color-footer-link);
}


/* ==========================================================================
   28. FOOTER HOME LINK
   ========================================================================== */

.rg-footer__home-link {
	flex:
		0 0 auto;
}


/* ==========================================================================
   29. FOOTER HOME LINK ANCHOR
   ========================================================================== */

.rg-footer__home-link a {
	display: inline-flex;

	align-items: center;

	min-height:
		var(--rajgir-control-min-height);

	color:
		var(--rajgir-color-footer-link);

	font-size:
		var(--rajgir-font-size-small);

	font-weight:
		var(--rajgir-font-weight-semibold);

	line-height:
		var(--rajgir-line-height-small);

	text-decoration: none;
}


/* ==========================================================================
   30. FOOTER HOME LINK — HOVER
   ========================================================================== */

.rg-footer__home-link a:hover {
	color:
		var(--rajgir-color-footer-link-hover);

	text-decoration:
		underline;

	text-underline-offset:
		0.15em;
}


/* ==========================================================================
   31. FOOTER HOME LINK — FOCUS
   ========================================================================== */

.rg-footer__home-link a:focus-visible {
	outline:
		2px solid var(--rajgir-color-focus);

	outline-offset:
		2px;

	border-radius:
		var(--rajgir-radius-focus);
}


/* ==========================================================================
   32. FOOTER WIDGET AREA COMPATIBILITY
   ========================================================================== */

.rg-footer .widget-area {
	min-width: 0;
}


/* ==========================================================================
   33. FOOTER WIDGET
   ========================================================================== */

.rg-footer .widget {
	margin: 0;
}


/* ==========================================================================
   34. FOOTER WIDGET TITLE
   ========================================================================== */

.rg-footer .widget-title {
	margin-top: 0;

	color:
		var(--rajgir-color-footer-heading);

	font-family:
		var(--rajgir-type-heading-font-family);

	font-size:
		var(--rajgir-type-heading-font-size);

	font-weight:
		var(--rajgir-type-heading-font-weight);

	line-height:
		var(--rajgir-type-heading-line-height);
}


/* ==========================================================================
   35. FOOTER GENERIC LINKS
   ========================================================================== */

.rg-footer a {
	color:
		var(--rajgir-color-footer-link);
}


/* ==========================================================================
   36. FOOTER GENERIC LINK HOVER
   ========================================================================== */

.rg-footer a:hover {
	color:
		var(--rajgir-color-footer-link-hover);
}


/* ==========================================================================
   37. FOOTER GENERIC LINK FOCUS
   ========================================================================== */

.rg-footer a:focus-visible {
	outline:
		2px solid var(--rajgir-color-focus);

	outline-offset:
		2px;
}


/* ==========================================================================
   38. FOOTER TEXT SAFETY
   ========================================================================== */

.rg-footer p,
.rg-footer li,
.rg-footer span {
	overflow-wrap:
		break-word;
}


/* ==========================================================================
   39. FOOTER TABLET
   ========================================================================== */

@media (min-width: 768px) {

	.rg-footer__main {
		grid-template-columns:
			minmax(0, 1fr)
			minmax(0, 1fr);
	}

	.rg-footer__identity {
		max-width:
			var(--rajgir-footer-identity-max-width);
	}

}


/* ==========================================================================
   40. FOOTER DESKTOP
   ========================================================================== */

@media (min-width: 1024px) {

	.rg-footer__main {
		grid-template-columns:
			minmax(
				var(--rajgir-footer-identity-column-min),
				var(--rajgir-footer-identity-column)
			)
			minmax(
				var(--rajgir-footer-navigation-column-min),
				1fr
			);
	}

	.rg-footer__navigation {
		align-self:
			start;
	}

}


/* ==========================================================================
   41. FOOTER LARGE SCREEN
   ========================================================================== */

@media (min-width: 1280px) {

	.rg-footer__main {
		gap:
			var(--rajgir-space-footer-large-gap);
	}

}


/* ==========================================================================
   42. FOOTER MOBILE
   ========================================================================== */

@media (max-width: 767px) {

	.rg-footer {
		padding:
			var(--rajgir-space-footer-mobile-block)
			0;
	}

	.rg-footer__main {
		grid-template-columns:
			1fr;
	}

	.rg-footer__navigation-list,
	.rg-footer__secondary-navigation ul {
		flex-direction: column;

		align-items: flex-start;

		width: 100%;
	}

	.rg-footer__bottom {
		align-items: flex-start;

		flex-direction: column;
	}

	.rg-footer__home-link {
		width: 100%;
	}

	.rg-footer__home-link a {
		width: 100%;
	}

}


/* ==========================================================================
   43. FOOTER MOBILE SAFE AREA
   ========================================================================== */

@media (max-width: 767px) {

	.rg-footer {
		padding-bottom:
			calc(
				var(--rajgir-space-footer-mobile-block)
				+
				env(
					safe-area-inset-bottom,
					0px
				)
			);
	}

}


/* ==========================================================================
   44. FOOTER RESPONSIVE PRESERVATION
   ========================================================================== */

/*
 * Mobile footer must remain readable and usable.
 *
 * Desktop:
 *
 * Footer
 *   ├── Identity
 *   ├── Navigation
 *   └── Footer Links
 *
 * Mobile:
 *
 * Footer
 *   ├── Identity
 *   ├── Navigation
 *   ├── Footer Links
 *   └── Copyright / Home
 *
 * Exact visual ordering must remain consistent with semantic order.
 */


/* ==========================================================================
   45. NO BLIND CSS REORDERING
   ========================================================================== */

.rg-footer__main,
.rg-footer__bottom {
	/*
	 * Semantic DOM order remains authoritative.
	 */
}


/* ==========================================================================
   46. FOOTER CONTRAST
   ========================================================================== */

/*
 * Footer foreground/background combinations consume centralized
 * accessibility-aware color tokens.
 *
 * Do not introduce arbitrary footer colors here.
 */


/* ==========================================================================
   47. FOOTER ACCESSIBILITY
   ========================================================================== */

/*
 * Footer navigation remains keyboard accessible.
 *
 * Focus must remain visible.
 *
 * CSS must not remove focus outlines without replacing them with an
 * equivalent visible focus indicator.
 */


/* ==========================================================================
   48. FOOTER SEMANTIC BOUNDARY
   ========================================================================== */

/*
 * Semantic ownership:
 *
 * <footer>
 *     ↓
 * site-footer.php
 *
 * <nav>
 *     ↓
 * footer navigation template/markup
 *
 * CSS:
 *     ↓
 * visual layout only
 */


/* ==========================================================================
   49. FOOTER DOCUMENT SHELL BOUNDARY
   ========================================================================== */

/*
 * footer.php owns:
 *
 * - closing main wrappers;
 * - loading site-footer.php;
 * - wp_footer();
 * - closing body/html.
 *
 * footer.css must not attempt to reproduce document-shell behavior.
 */


/* ==========================================================================
   50. FOOTER NAVIGATION BOUNDARY
   ========================================================================== */

/*
 * footer.css
 *     =
 * Footer layout
 *
 * Navigation component/template
 *     =
 * Navigation behavior/presentation
 *
 * Footer CSS must not become the global navigation engine.
 */


/* ==========================================================================
   51. FOOTER IDENTITY BOUNDARY
   ========================================================================== */

/*
 * Site identity is presentation.
 *
 * Site name and description values come from the WordPress/site
 * configuration layer through site-footer.php.
 *
 * CSS does not determine identity.
 */


/* ==========================================================================
   52. FOOTER COPYRIGHT BOUNDARY
   ========================================================================== */

/*
 * Copyright content is provided by the appropriate template part /
 * application presentation layer.
 *
 * footer.css only controls its layout and typography.
 */


/* ==========================================================================
   53. FOOTER PERFORMANCE
   ========================================================================== */

/*
 * Footer is present across the public site.
 *
 * Avoid:
 *
 * - heavy animation;
 * - unnecessary background media;
 * - large visual effects;
 * - unnecessary DOM-dependent styling;
 * - unnecessary JavaScript.
 */


/* ==========================================================================
   54. FOOTER MEDIA BOUNDARY
   ========================================================================== */

/*
 * If footer media is introduced:
 *
 * Media presentation
 *     ↓
 * common media component
 *
 * Media storage/processing
 *     ↓
 * RG_MEDIA
 *
 * Footer CSS does not own media management.
 */


/* ==========================================================================
   55. FOOTER DARK / LIGHT COMPATIBILITY
   ========================================================================== */

/*
 * Theme appearance variations must consume centralized design tokens.
 *
 * Do not hard-code a second color system inside footer.css.
 */


/* ==========================================================================
   56. FOOTER MOTION
   ========================================================================== */

.rg-footer a {
	transition:
		var(--rajgir-motion-transition-fast);
}


/* ==========================================================================
   57. REDUCED MOTION
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {

	.rg-footer a {
		transition: none;
	}

}


/* ==========================================================================
   58. FOOTER PRINT
   ========================================================================== */

@media print {

	.rg-footer {
		border-top:
			1px solid var(--rajgir-color-border);

		background:
			transparent;

		color:
			var(--rajgir-color-text);
	}

	.rg-footer a {
		color:
			var(--rajgir-color-text);
	}

}


/* ==========================================================================
   59. FINAL FOOTER ARCHITECTURE
   ========================================================================== */

/*
 * Main Content
 *      ↓
 * Footer
 *      ├── Site Identity
 *      ├── Footer Navigation
 *      ├── Footer Links
 *      └── Copyright / Home
 *
 * Presentation only.
 */