/*
Theme Name: Astra Child
Theme URI: http://example.com/astra-child
Description: Child theme for Astra with dynamic Google Maps.
Author: Webmix
Template: astra
Version: 1.0.0
Text Domain: astra-child
*/



.gm-style-iw .map-info-window {
		max-width: 220px !important;
		text-align: center;
		padding: 10px !important;
		border-radius: 8px;
		background: #fff;
		font-family: Arial, sans-serif;

		/* Animation */
		transform: scale(0.95);
		opacity: 0;
		animation: popIn 0.25s forwards;
		
		.map-info-logo {
				max-width: 150px;
				height: auto;
				margin-bottom: 1rem;
		}
		
		.map-info-title {
				margin: 0 0 1.5rem 0;
				font-size: 1.25rem;
		}
		
		.map-info-link {
				display: inline-block;
				padding: 6px 12px;
				background: var(--e-global-color-accent);
				color: #fff;
				text-decoration: none;
				border-radius: 4px;
				font-size: 14px;
				transition: background 0.2s;
		}
		
		.map-info-link:hover {
				background: var(--e-global-color-secondary);;
		}
}

@keyframes popIn {
		to {
				transform: scale(1);
				opacity: 1;
		}
}

/* Optional: remove scrollbars inside InfoWindow */
.gm-style .gm-style-iw-c {
	background: white;
	padding: 0;
}
.gm-style-iw .gm-style-iw-d {
		max-height: none !important;
		overflow: visible !important;
}

.geo-search-form {
		width: 100%;
		margin: 0 auto;
}

.geo-search-wrapper {
		position: relative;
		width: 100%;
}

#geo-location-input {
		width: 100%;
		padding: 10px 40px 10px 12px;
		border-radius: 8px;
		border: 1px solid #ccc;
		font-size: 16px;
		transition: border 0.2s, box-shadow 0.2s;
}

#geo-location-input:focus {
		outline: none;
		border-color: var(--e-global-color-accent, #0073e6);
		box-shadow: 0 0 4px rgba(0,0,0,0.1);
}

#geo-location-input.geo-error {
		border: 1px solid #e74c3c;
		transition: border 0.2s;
}

.geo-search-icon {
		position: absolute;
		right: 8px;
		top: 50%;
		transform: translateY(-50%);
		background: none;
		border: none;
		cursor: pointer;
		padding: 4px;
		display: flex;
		align-items: center;
		justify-content: center;
		color: var(--e-global-color-accent, #0073e6);
}

.geo-search-icon:hover {
		color: var(--e-global-color-secondary, #005bb5);
}

.geo-search-icon svg {
		display: block;
}

/* Overlay for input or map */
.loading-overlay {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background: rgba(255,255,255,0.6);
		display: flex;
		align-items: center;
		justify-content: center;
		z-index: 9999;
		pointer-events: none;
}

.loading-overlay svg {
		width: 24px;
		height: 24px;
		animation: spin 1s linear infinite;
}

@keyframes spin {
		from { transform: rotate(0deg); }
		to   { transform: rotate(360deg); }
}

#geo-search-shortcode,
#dynamic-map {
		position: relative;
}

.map-message-overlay {
		position: absolute;
		top: 40%; /* start slightly above */
		left: 50%;
		transform: translate(-50%, -50%);
		width: 80%;
		height: fit-content;
		background: rgba(255, 255, 255, 0.95);
		display: flex;
		align-items: center;
		justify-content: center;
		text-align: center;
		font-weight: bold;
		font-size: 16px;
		color: #e74c3c;
		z-index: 9999;
		pointer-events: none;
		border-radius: 12px;
		border: 1px solid #e74c3c;
		padding: 1.5rem 2rem;
		box-sizing: border-box;
		box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);

		/* fade-in with top movement */
		opacity: 0;
		animation: showMessageTop 0.25s forwards;
}

@keyframes showMessageTop {
		from {
				top: 40%;
				opacity: 0;
		}
		to {
				top: 50%;
				opacity: 1;
		}
}