/**
 * An Phú Hưng - Blue Background Palette
 * Designed for the "an-phu-hung-signature" WordPress theme.
 */

body.aph-blue-background {
	--aph-navy: #062f5b;
	--aph-navy-2: #08477f;
	--aph-navy-3: #1268ad;
	--aph-cream: #e5f1fc;
	--aph-paper: #f1f7fd;
	--aph-ink: #092540;
	--aph-text: #405d76;
	--aph-muted: #668098;
	--aph-line: #c9dced;
	--aph-line-dark: rgba(255, 255, 255, 0.17);
	--aph-shadow: 0 28px 80px rgba(4, 45, 86, 0.16);
	--aph-shadow-soft: 0 18px 50px rgba(4, 45, 86, 0.11);

	background-color: #e8f3fd;
}

/* Header and navigation */
.aph-blue-background .aph-topbar {
	background: #041f3b;
}

.aph-blue-background .aph-header,
.aph-blue-background .aph-header__main,
.aph-blue-background .aph-mobile-nav,
.aph-blue-background .aph-nav__list .sub-menu {
	background-color: #f4f9fe;
}

.aph-blue-background .aph-header {
	border-bottom-color: #c9dced;
	box-shadow: 0 8px 30px rgba(4, 45, 86, 0.07);
}

.aph-blue-background .aph-nav__list .sub-menu a:hover {
	background-color: #e5f1fc;
}

/* Main dark-blue brand surfaces */
.aph-blue-background .aph-hero,
.aph-blue-background .aph-details,
.aph-blue-background .aph-process,
.aph-blue-background .aph-testimonials,
.aph-blue-background .aph-page-hero {
	background-color: #062f5b;
	background-image:
		radial-gradient(circle at 86% 12%, rgba(31, 128, 201, 0.22), transparent 34%),
		linear-gradient(135deg, #041f3b 0%, #063665 54%, #08477f 100%);
}

/* Light-blue content rhythm */
.aph-blue-background .aph-services,
.aph-blue-background .aph-projects,
.aph-blue-background .aph-news,
.aph-blue-background .aph-content-wrap,
.aph-blue-background .aph-archive,
.aph-blue-background .aph-search-results,
.aph-blue-background .site-main {
	background-color: #e8f3fd;
}

.aph-blue-background .aph-about,
.aph-blue-background .aph-values,
.aph-blue-background .aph-related,
.aph-blue-background .aph-contact-section {
	background-color: #f4f9fe;
}

/* Keep cards crisp and readable above the blue page background */
.aph-blue-background .aph-service-card,
.aph-blue-background .aph-news-card,
.aph-blue-background .aph-entry,
.aph-blue-background .aph-sidebar-card--light,
.aph-blue-background .aph-hero__floating-card,
.aph-blue-background .aph-about__inset,
.aph-blue-background .wp-block-group.has-background {
	background-color: #ffffff;
}

.aph-blue-background .aph-service-card,
.aph-blue-background .aph-news-card,
.aph-blue-background .aph-entry,
.aph-blue-background .aph-sidebar-card--light {
	border-color: #c9dced;
	box-shadow: 0 18px 50px rgba(4, 45, 86, 0.09);
}

/* Turn the large consultation strip blue while retaining gold as an accent */
.aph-blue-background .aph-consult {
	color: rgba(255, 255, 255, 0.76);
	background-color: #0b5f9f;
	background-image: linear-gradient(120deg, #08477f 0%, #0b63a6 62%, #1681c4 100%);
}

.aph-blue-background .aph-consult h2,
.aph-blue-background .aph-consult h3,
.aph-blue-background .aph-consult .aph-kicker {
	color: #ffffff;
}

.aph-blue-background .aph-consult .aph-kicker::before {
	background-color: var(--aph-gold);
}

.aph-blue-background .aph-consult__phone {
	background-color: #041f3b;
	box-shadow: 12px 12px 0 rgba(3, 27, 51, 0.22);
}

/* Closing call-to-action and footer */
.aph-blue-background .aph-final-cta {
	background-color: #073b6e;
	background-image: linear-gradient(110deg, #052a50 0%, #08477f 100%);
}

.aph-blue-background .aph-footer {
	background-color: #03182e;
	background-image: linear-gradient(160deg, #03182e 0%, #062f5b 100%);
}

/* Common editor blocks used inside service and product pages */
.aph-blue-background .entry-content blockquote {
	background-color: #e5f1fc;
}

.aph-blue-background .entry-content table,
.aph-blue-background .entry-content td {
	background-color: #ffffff;
}

/* Visible keyboard focus on both light and dark blue surfaces */
.aph-blue-background a:focus-visible,
.aph-blue-background button:focus-visible,
.aph-blue-background input:focus-visible,
.aph-blue-background textarea:focus-visible,
.aph-blue-background select:focus-visible {
	outline: 3px solid #59b6f2;
	outline-offset: 3px;
}

@media (max-width: 960px) {
	.aph-blue-background .aph-header__nav,
	.aph-blue-background .aph-nav {
		background-color: #f4f9fe;
	}
}

/* Desktop-only quick contact buttons. Mobile keeps the theme's existing bar. */
.aph-blue-background .aph-desktop-contact {
	display: none;
}

@media (min-width: 961px) {
	.aph-blue-background .aph-desktop-contact {
		position: fixed;
		z-index: 720;
		right: 24px;
		bottom: 88px;
		display: flex;
		flex-direction: column;
		gap: 10px;
		width: 184px;
	}

	.aph-blue-background .aph-desktop-contact__button {
		min-height: 58px;
		padding: 9px 14px 9px 10px;
		display: flex;
		align-items: center;
		gap: 11px;
		border: 1px solid rgba(255, 255, 255, 0.24);
		border-radius: 999px 4px 4px 999px;
		box-shadow: 0 14px 34px rgba(3, 24, 46, 0.24);
		text-decoration: none;
		transform: translateX(0);
		transition: transform 0.2s ease, box-shadow 0.2s ease, filter 0.2s ease;
	}

	.aph-blue-background .aph-desktop-contact__button:hover {
		color: #ffffff;
		box-shadow: 0 18px 42px rgba(3, 24, 46, 0.3);
		filter: brightness(1.04);
		transform: translateX(-5px);
	}

	.aph-blue-background .aph-desktop-contact__button--zalo {
		color: #ffffff;
		background: linear-gradient(115deg, #005bd7 0%, #0878ff 100%);
	}

	.aph-blue-background .aph-desktop-contact__button--phone {
		color: #062f5b;
		background: linear-gradient(115deg, #d5ad66 0%, #e5c88d 100%);
	}

	.aph-blue-background .aph-desktop-contact__button--phone:hover {
		color: #062f5b;
	}

	.aph-blue-background .aph-desktop-contact__icon {
		width: 38px;
		height: 38px;
		flex: 0 0 38px;
		display: grid;
		place-items: center;
		border-radius: 50%;
		color: #ffffff;
		background: #062f5b;
	}

	.aph-blue-background .aph-desktop-contact__icon--zalo {
		position: relative;
		overflow: visible;
		color: #0068ff;
		background: #ffffff;
		border: 1px solid rgba(255, 255, 255, 0.88);
		box-shadow: inset 0 0 0 1px rgba(0, 104, 255, 0.08), 0 4px 12px rgba(0, 45, 112, 0.2);
	}

	.aph-blue-background .aph-desktop-contact__icon--zalo::after {
		content: "";
		position: absolute;
		right: -1px;
		bottom: 0;
		width: 9px;
		height: 9px;
		border: 2px solid #ffffff;
		border-radius: 50%;
		background: #22c55e;
		box-shadow: 0 2px 6px rgba(3, 24, 46, 0.2);
	}

	.aph-blue-background .aph-desktop-contact__icon--zalo svg {
		width: 36px;
		height: 36px;
		overflow: visible;
	}

	.aph-blue-background .aph-zalo-mark__bubble {
		fill: #0068ff;
	}

	.aph-blue-background .aph-zalo-mark__word {
		fill: #ffffff;
		font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
		font-size: 12px;
		font-weight: 850;
		letter-spacing: -0.04em;
	}

	.aph-blue-background .aph-desktop-contact__icon svg {
		width: 21px;
		height: 21px;
		fill: currentColor;
	}

	.aph-blue-background .aph-desktop-contact__copy {
		min-width: 0;
		display: flex;
		flex-direction: column;
		line-height: 1.18;
	}

	.aph-blue-background .aph-desktop-contact__copy small {
		margin-bottom: 3px;
		color: inherit;
		opacity: 0.75;
		font-size: 9px;
		font-weight: 650;
		letter-spacing: 0.05em;
		text-transform: uppercase;
	}

	.aph-blue-background .aph-desktop-contact__copy strong {
		color: inherit;
		font-size: 13px;
		font-weight: 800;
		white-space: nowrap;
	}
}

@media print {
	.aph-blue-background .aph-desktop-contact {
		display: none !important;
	}
}

@media (prefers-reduced-motion: reduce) {
	.aph-blue-background *,
	.aph-blue-background *::before,
	.aph-blue-background *::after {
		scroll-behavior: auto !important;
	}
}
