/* ==========================================================================
   AAN Mobile Call Bar
   --------------------------------------------------------------------------
   Layout chrome ONLY. Action colours come from the theme-kit classes on the
   icons (.text-primary / .text-danger / .text-secondary in the compiled
   theme style.css), so re-skinning the kit re-skins this bar automatically.
   The few surface/size values are exposed as --aan-callbar-* custom
   properties so a dealer CAN override them (e.g. a dark kit) without editing
   the plugin.
   ========================================================================== */

.aan-callbar {
	position: fixed;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 1040; /* above page chrome, below BS modals (1050+) */
	display: flex;
	align-items: stretch;
	margin: 0;
	background: var(--aan-callbar-surface, #fff);
	border-top: 1px solid var(--aan-callbar-border, rgba(17, 20, 24, .12));
	box-shadow: 0 -2px 10px rgba(17, 20, 24, .08);
	/* keep clear of the iOS home indicator */
	padding-bottom: env(safe-area-inset-bottom, 0px);
	font-family: inherit;
}

.aan-callbar__item {
	flex: 1 1 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 3px;
	min-height: var(--aan-callbar-height, 54px);
	padding: 6px 4px;
	color: var(--aan-callbar-label, #1c1c1c); /* fallback icon colour if kit classes absent */
	text-decoration: none;
	line-height: 1;
	border-left: 1px solid var(--aan-callbar-border, rgba(17, 20, 24, .08));
	-webkit-tap-highlight-color: transparent;
	transition: background-color .15s ease;
}

.aan-callbar__item:first-child {
	border-left: 0;
}

.aan-callbar__item:hover,
.aan-callbar__item:focus {
	background: rgba(17, 20, 24, .04);
	text-decoration: none;
}

.aan-callbar__item:active {
	background: rgba(17, 20, 24, .08);
}

.aan-callbar__icon {
	display: block;
	width: 22px;
	height: 22px;
}

.aan-callbar__icon svg {
	display: block;
	width: 100%;
	height: 100%;
	fill: currentColor; /* inherits the kit .text-* colour set on this span */
}

.aan-callbar__label {
	font-size: 11px;
	font-weight: 600;
	letter-spacing: .02em;
	color: var(--aan-callbar-label, #1c1c1c);
	text-transform: none;
}

/* Reserve space so the fixed bar never covers footer content. */
body.aan-has-callbar {
	padding-bottom: calc(var(--aan-callbar-height, 54px) + env(safe-area-inset-bottom, 0px));
}

/* Mobile-only mode: hide the bar and release the reserved padding >= 992px
   (the desktop header already carries the phone CTA). */
@media (min-width: 992px) {
	.aan-callbar--mobile {
		display: none;
	}
	body.aan-has-callbar--mobile {
		padding-bottom: 0;
	}
}
