/* ==========================================================================
   Veolog · Notifications (Toasts)
   Tema integrado com tokens globais do modo claro
   Bottom-left · Responsivo · Sem progress bar
   ========================================================================== */

:root{
	--toast-font: var(--font-sans, "DM Sans", system-ui, -apple-system, Segoe UI, Roboto, Inter, sans-serif);
	--toast-z: 2147483000;
	--toast-w: 360px;
	--toast-gap: 10px;
	--toast-radius: 14px;
	--toast-shadow: 0 14px 36px rgba(0,0,0,.22);
	--toast-pad: 14px 16px;

	/* Base neutra (para uso em .veo-toast genérico) */
	--toast-bg: var(--card);
	--toast-fg: var(--fg);

	/* Variantes sólidas (mantidas fortes em ambos temas) */
	--t-info-bg:   #2563eb; /* azul */
	--t-info-fg:   #ffffff;

	--t-success-bg:#16a34a; /* verde */
	--t-success-fg:#ffffff;

	--t-warn-bg:   #f59e0b; /* âmbar */
	--t-warn-fg:   #111827;

	--t-error-bg:  #dc2626; /* vermelho */
	--t-error-fg:  #ffffff;

	--t-loading-bg:#6b7280; /* cinza neutro */
	--t-loading-fg:#ffffff;
}

/* ================== Container raiz (posicionamento) ================== */
.veo-toasts{
	position:fixed;
	inset-inline-start:16px;
	inset-block-end:16px;
	display:flex;
	flex-direction:column;
	gap:var(--toast-gap);
	z-index:var(--toast-z);
	max-width:calc(100vw - 32px);
	pointer-events:none;
}
.veo-toasts.top{
	inset-block-start:16px;
	inset-block-end:auto;
}
.veo-toasts.right{
	inset-inline-end:16px;
	inset-inline-start:auto;
}
.veo-toasts.center{
	inset-inline:0;
	align-items:center;
}

/* ================== Toast ================== */
.veo-toast{
	width:min(var(--toast-w), calc(100vw - 32px));
	border:none;
	border-radius:var(--toast-radius);
	box-shadow:var(--toast-shadow);
	padding:var(--toast-pad);
	display:grid;
	grid-template-columns:auto 1fr auto;
	grid-template-areas:"icon content close";
	align-items:start;
	gap:12px;
	pointer-events:auto;
	opacity:0;
	transform:translateY(8px);
	animation:veo-toast-in .20s ease-out forwards;

	background:var(--toast-bg);
	color:var(--toast-fg);
	font-family:var(--toast-font);
}

/* Variantes sólidas */
.veo-toast.info{
	background:var(--t-info-bg);
	color:var(--t-info-fg);
}
.veo-toast.success{
	background:var(--t-success-bg);
	color:var(--t-success-fg);
}
.veo-toast.warn{
	background:var(--t-warn-bg);
	color:var(--t-warn-fg);
}
.veo-toast.error{
	background:var(--t-error-bg);
	color:var(--t-error-fg);
}
.veo-toast.loading{
	background:var(--t-loading-bg);
	color:var(--t-loading-fg);
}

/* Estrutura interna */
.veo-toast__icon{
	grid-area:icon;
	line-height:1;
	font-size:18px;
	margin-top:2px;
	opacity:.95;
}
.veo-toast__icon svg{
	display:block;
	width:20px;
	height:20px;
	stroke-width:2.2;
	margin-bottom:2px;
}
.veo-toast__content{
	grid-area:content;
}
.veo-toast__title{
	font-weight:700;
	margin:0 0 2px;
	font-size:14px;
	letter-spacing:.2px;
}
.veo-toast__msg{
	margin:0;
	font-size:13px;
	line-height:1.35;
	opacity:.97;
}

/* Botão fechar */
.veo-toast__close{
	grid-area:close;
	border:0;
	background:transparent;
	color:inherit;
	font:inherit;
	cursor:pointer;
	padding:0 2px;
	opacity:.85;
	transition:transform .12s ease, opacity .12s ease;
}
.veo-toast__close:hover{
	opacity:1;
	transform:scale(1.08);
}

/* Ação opcional */
.veo-toast__action{
	margin-top:8px;
	display:inline-flex;
	align-items:center;
	gap:8px;
	padding:6px 12px;
	border-radius:999px;
	border:0;
	background:rgba(255,255,255,.18);
	color:#fff;
	cursor:pointer;
	font-size:12px;
	font-weight:600;
	letter-spacing:.2px;
}
.veo-toast.warn .veo-toast__action{
	background:rgba(0,0,0,.14);
	color:var(--t-warn-fg);
}

/* Sem progress bar */
.veo-toast__progress,
.veo-toast__progress>span{
	display:none !important;
}

/* Animações */
@keyframes veo-toast-in{
	from{ opacity:0; transform:translateY(8px); }
	to{ opacity:1; transform:translateY(0); }
}
@keyframes veo-toast-out{
	to{ opacity:0; transform:translateY(6px); }
}

/* Responsivo */
@media (max-width:480px){
	.veo-toasts{
		inset-inline:8px;
	}
	.veo-toast{
		width:calc(100vw - 16px);
	}
}