/* Istal - Notificaciones de inscripción (popup tipo "venta reciente") */

.istal-notif-container {
	position: fixed;
	z-index: 999999;
	display: flex;
	flex-direction: column;
	gap: 10px;
	max-width: 360px;
	pointer-events: none;
}
.istal-notif-container.istal-notif-pos-bottom-right { right: 16px; bottom: 16px; align-items: flex-end; }
.istal-notif-container.istal-notif-pos-bottom-left  { left: 16px; bottom: 16px; align-items: flex-start; }
.istal-notif-container.istal-notif-pos-top-right    { right: 16px; top: 16px; align-items: flex-end; }
.istal-notif-container.istal-notif-pos-top-left     { left: 16px; top: 16px; align-items: flex-start; }

.istal-notif-card {
	pointer-events: auto;
	display: flex;
	align-items: center;
	gap: 12px;
	width: 320px;
	max-width: calc(100vw - 32px);
	box-sizing: border-box;
	background: var(--istal-notif-fondo, #ffffff);
	border: 2px solid var(--istal-notif-borde, #cccccc);
	border-radius: var(--istal-notif-radio, 10px);
	box-shadow: 0 6px 24px rgba(0, 0, 0, .16);
	padding: 12px 36px 12px 12px;
	text-decoration: none;
	color: inherit;
	position: relative;
	opacity: 0;
	transition: opacity .35s ease, transform .35s ease;
	cursor: pointer;
}
.istal-notif-card,
.istal-notif-card:hover,
.istal-notif-card:focus,
.istal-notif-card *,
.istal-notif-card:hover *,
.istal-notif-card:focus * {
	text-decoration: none !important;
}
.istal-notif-card.istal-notif-glass {
	background: color-mix(in srgb, var(--istal-notif-fondo, #ffffff) 82%, transparent);
	backdrop-filter: blur(8px);
	-webkit-backdrop-filter: blur(8px);
}
.istal-notif-card.istal-notif-anim-slide { transform: translateY(20px); }
.istal-notif-card.istal-notif-anim-fade  { transform: none; }
.istal-notif-card.istal-notif-show { opacity: 1; transform: translateY(0); }
.istal-notif-card.istal-notif-hide { opacity: 0; }

.istal-notif-img {
	width: 46px;
	height: 46px;
	border-radius: 8px;
	object-fit: cover;
	flex-shrink: 0;
}

.istal-notif-body {
	min-width: 0;
	font-family: var(--istal-notif-fuente, 'Lato', sans-serif);
}

.istal-notif-title {
	font-size: 13.5px;
	font-weight: 700;
	color: var(--istal-notif-titulo, #1035B8);
	margin-bottom: 2px;
}

.istal-notif-ubicacion {
	font-weight: 400;
	color: var(--istal-notif-fecha, #878080);
}

.istal-notif-flag {
	width: 16px;
	height: auto;
	border-radius: 2px;
	vertical-align: middle;
	display: inline-block;
	box-shadow: 0 0 0 1px rgba(0, 0, 0, .08);
}

.istal-notif-msg {
	font-size: 13px;
	color: var(--istal-notif-mensaje, #CE471A);
	line-height: 1.35;
}

.istal-notif-fecha {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 6px;
	font-size: 11px;
	color: var(--istal-notif-fecha, #878080);
	margin-top: 4px;
}

.istal-notif-badge {
	display: inline-flex;
	align-items: center;
	gap: 3px;
}

.istal-notif-check {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 13px;
	height: 13px;
	border-radius: 50%;
	background: #8a8f98;
	color: #fff;
	font-size: 8px;
	line-height: 1;
	font-weight: 700;
	flex-shrink: 0;
}

.istal-notif-close {
	position: absolute;
	top: 6px;
	right: 8px;
	background: none;
	border: none;
	font-size: 16px;
	line-height: 1;
	color: #999;
	cursor: pointer;
	padding: 2px 4px;
}
.istal-notif-close:hover { color: #333; }

@media (max-width: 600px) {
	.istal-notif-container.istal-notif-mpos-bottom { top: auto !important; bottom: 12px !important; }
	.istal-notif-container.istal-notif-mpos-top    { bottom: auto !important; top: 12px !important; }
	.istal-notif-container { left: 12px !important; right: 12px !important; max-width: none; align-items: stretch !important; }
	.istal-notif-card { width: 100%; }
}