/* ==========================================================================
   Agensis Chatbot — skin AGENSLAB (TV rétro / terminal)  v1.1.0
   Enveloppe visuelle pure : le moteur (chat.js + REST) est inchangé.
   Namespace .aglab- pour ne jamais entrer en collision avec Divi/site.
   Police MatrixSans : locale (OFL), conforme nLPD — aucun appel externe.
   ========================================================================== */

@font-face {
	font-family: 'MatrixSans';
	src: url('polices/MatrixSans-Regular.woff2') format('woff2');
	font-weight: normal; font-style: normal; font-display: swap;
}
@font-face {
	font-family: 'MatrixSansVideo';
	src: url('polices/MatrixSansVideo-Regular.woff2') format('woff2');
	font-weight: normal; font-style: normal; font-display: swap;
}

.aglab {
	--aglab-cyan:   #17bebb;
	--aglab-green:  #8ac926;
	--aglab-orange: #e25822;
	--aglab-text:   #e8e6e0;
	--aglab-font:   'MatrixSans', 'Cascadia Mono', 'Consolas', monospace;
	font-family: var(--aglab-font);
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: .6rem;
	width: 100%;
}
.aglab *, .aglab *::before, .aglab *::after { box-sizing: border-box; }
.aglab[hidden] { display: none !important; }

/* ---------- paramètre police de l'écran (le widget a11y du site garde priorité : #agensis-page) ---------- */
.aglab .aglab-log, .aglab .aglab-msg p, .aglab .aglab-who,
.aglab .aglab-typing, .aglab .aglab-phase-wake p {
	font-family: var(--aglab-font) !important;
}
.aglab--font-video   { --aglab-font: 'MatrixSansVideo', 'Cascadia Mono', 'Consolas', monospace; }
.aglab--font-lisible { --aglab-font: 'Poppins', Helvetica, Arial, sans-serif; }

/* ---------- viewport : la TV (desktop) / écran seul (mobile) ---------- */
.aglab-viewport {
	position: relative;
	width: min(46rem, 100%);
	aspect-ratio: 1033.47 / 1073;
}
.aglab-frame { position: absolute; inset: 0; }
.aglab-frame svg { width: 100%; height: 100%; display: block; }
.aglab-frame-popup { display: none; }

.aglab-content {
	position: absolute;
	left: 14.2%; top: 14%; width: 71.4%; height: 51.8%;
	display: flex; flex-direction: column; overflow: hidden;
	font-size: clamp(.88rem, 2.2vw, 1.02rem);
}

/* Mobile / conteneurs étroits : on retire le décor TV, écran plein cadre cyan */
@media (max-width: 640px) {
	.aglab-viewport { aspect-ratio: 814.82 / 620.11; }
	.aglab-frame-tv { display: none; }
	.aglab-frame-popup { display: block; }
	.aglab-content { left: 3.6%; top: 4.2%; width: 92.7%; height: 91.3%; }
}

/* scanlines subtiles — uniquement si effets actifs */
.aglab.aglab--fx .aglab-content::before {
	content: ""; position: absolute; inset: 0; pointer-events: none; z-index: 5;
	background: repeating-linear-gradient(0deg, transparent 0 3px, rgba(0,0,0,.10) 3px 4px);
}

/* ---------- phases intro ---------- */
.aglab-phase {
	position: absolute; inset: 0; display: none;
	flex-direction: column; align-items: center; justify-content: center;
	gap: .9rem; padding: 5%;
}
.aglab-phase.is-active { display: flex; }
.aglab-boot-bird { width: 38%; max-width: 10rem; }
.aglab-boot-word { width: 50%; max-width: 13rem; }
.aglab.aglab--fx .aglab-phase-boot.is-active .aglab-boot-bird { animation: aglab-flick 1.3s steps(2) infinite; }
@keyframes aglab-flick { 50% { opacity: .88; } }

.aglab-phase-wake { align-items: flex-start; justify-content: flex-start; }
.aglab-phase-wake p { color: var(--aglab-green); line-height: 1.7; white-space: pre-wrap; margin: 0; }

.aglab-skip {
	position: absolute; bottom: 4%; right: 4%; z-index: 6;
	background: none; border: 1px solid var(--aglab-green); color: var(--aglab-green);
	font-family: inherit; font-size: .7rem; padding: .4rem .7rem; min-height: 28px;
	border-radius: .3rem; cursor: pointer; opacity: .8;
}
.aglab-skip:hover { opacity: 1; }

/* ---------- chat ---------- */
.aglab-chat { position: static; display: none; flex: 1; flex-direction: column; min-height: 0; }
.aglab-chat.is-active { display: flex; }

.aglab-log {
	flex: 1; min-height: 0; overflow-y: auto; padding: 5% 6% 2%;
	display: flex; flex-direction: column; gap: .9em; line-height: 1.55;
	scrollbar-width: thin; scrollbar-color: var(--aglab-cyan) transparent;
}
.aglab-msg .aglab-who {
	display: flex; align-items: center; gap: .45em;
	margin-bottom: .2em; font-size: .9em;
}
.aglab-msg--bot .aglab-who { color: var(--aglab-green); }
.aglab-msg--user .aglab-who { color: var(--aglab-orange); }
.aglab-who svg { width: 1.05em; height: 1.3em; flex: none; }
.aglab-msg p { color: var(--aglab-text); white-space: pre-wrap; margin: 0 0 0 1.5em; }
.aglab-msg--user p { margin-left: 0; }
.aglab-msg p a { color: var(--aglab-cyan); text-decoration: underline; word-break: break-all; }

.aglab-cursor::after { content: "▌"; color: var(--aglab-green); animation: aglab-blink 1s steps(1) infinite; }
.aglab:not(.aglab--fx) .aglab-cursor::after { content: ""; }
@keyframes aglab-blink { 50% { opacity: 0; } }

.aglab-typing { color: var(--aglab-green); font-size: .75em; opacity: .85; padding: 0 6% .3em; min-height: 1.2em; }

.aglab-inputrow {
	display: flex; gap: .5em; padding: .6em 6% 5%;
	border-top: 1px solid rgba(232,230,224,.18);
}
.aglab-prompt { color: var(--aglab-orange); align-self: center; }
.aglab .aglab-input,
.aglab .aglab-input:focus {
	flex: 1; min-width: 0;
	background: transparent !important;
	border: none !important;
	box-shadow: none !important;
	border-radius: 0 !important;
	color: var(--aglab-text) !important;
	font-family: var(--aglab-font) !important;
	font-size: 1em !important;
	line-height: 1.4 !important;
	caret-color: var(--aglab-green);
	outline: none; padding: 0 !important; margin: 0 !important;
	height: auto !important; min-height: 0 !important;
}
.aglab-input::placeholder { color: rgba(232,230,224,.58); }
.aglab .aglab-send {
	background: var(--aglab-cyan) !important; border: none !important; color: #0c0d0e !important;
	font-family: inherit; font-weight: bold; font-size: .8em;
	padding: .35em .9em; border-radius: .35em; cursor: pointer;
}
.aglab-send:disabled { opacity: .5; cursor: default; }

/* focus visibles (accessibilité) */
.aglab button:focus-visible, .aglab input:focus-visible, .aglab-bar button:focus-visible {
	outline: 3px solid var(--aglab-orange); outline-offset: 2px;
}

/* ---------- bouton tT : incrusté dans le visuel (coque de la TV, à côté
   de l'oiseau origami). N'existe que là où le visuel existe : le mode
   classique n'affiche jamais de référence au choix de police. ---------- */
.aglab-font-btn {
	position: absolute; z-index: 7;
	left: 13%; top: 69%;
	width: 2.1rem; height: 2.1rem; padding: 0;
	display: inline-flex; align-items: center; justify-content: center;
	background: transparent; color: #1b3a4b;
	border: 1.5px solid #1b3a4b; border-radius: .35rem;
	cursor: pointer;
}
.aglab-font-btn .aglab-font-ico { display: inline-flex; width: 1.05em; height: 1.3em; }
.aglab-font-btn .aglab-font-ico svg { width: 100%; height: 100%; }
.aglab-font-btn:hover { background: var(--aglab-cyan); }
.aglab-font-btn[hidden] { display: none !important; }
/* popup (mobile) et fenêtre : pas de coque — le tT se pose sur le cadre cyan, en bas à droite.
   Sur smartphone, le système fenêtré n'existe pas : Agrandir masqué. */
@media (max-width: 640px) {
	.aglab-font-btn { left: auto; top: auto; right: 1.4%; bottom: .5%; width: 1.9rem; height: 1.9rem; color: #0c0d0e; border-color: rgba(12, 13, 14, .55); }
	.aglab-viewport { cursor: pointer; } /* tap = ouvrir la discussion en plein écran */
	.aglab-content { cursor: auto; }
}
.aglab-win .aglab-font-btn { display: none !important; } /* le tT vit sur la TV, pas en fenêtre */

/* ---------- barre sous la TV : options + disclaimer ---------- */
.aglab-bar {
	display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; justify-content: center;
}
.aglab-bar { font-family: 'MatrixSans', 'Consolas', monospace; }
.aglab-bar button {
	font-family: inherit; font-size: .75rem;
	padding: .45rem .8rem; min-height: 32px; border-radius: .4rem; cursor: pointer;
	border: 2px solid var(--aglab-cyan); background: transparent; color: inherit;
	display: inline-flex; align-items: center; gap: .35rem;
}
.aglab-bar button[aria-pressed="true"] { background: var(--aglab-cyan); color: #fff; }

.aglab-disclaimer {
	font-size: .68rem; opacity: .75; text-align: center; max-width: 36rem; line-height: 1.5;
}

.aglab-sr {
	position: absolute; width: 1px; height: 1px; margin: -1px;
	overflow: hidden; clip-path: inset(50%); white-space: nowrap;
}

/* ---------- mode FENÊTRÉ : l'écran devient une fenêtre ancrée en bas ----------
   (téléportée dans <body> pour échapper aux contextes d'empilement Divi) */
.aglab-win {
	position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); z-index: 99995;
	/* ~78 % de l'ancien plein écran (qui faisait min(94vw, 86vh×ratio)) */
	width: min(73vw, calc(67vh * 1.3141), calc(100vw - 2rem));
	min-width: min(22rem, calc(100vw - 2rem));
	max-height: calc(100vh - 6rem);
	display: flex; flex-direction: column; gap: 0;
	filter: drop-shadow(0 .5rem 1.2rem rgba(0, 0, 0, .45));
}
.aglab-win[hidden] { display: none !important; }
.aglab-winbar {
	cursor: move; touch-action: none; user-select: none;
	display: flex; align-items: center; gap: .5rem;
	background: #eae2b7; color: #1b3a4b;
	border: 2px solid #1b3a4b; border-bottom: none;
	border-radius: .6rem .6rem 0 0;
	padding: .3rem .4rem .3rem .7rem;
	font-family: 'MatrixSans', 'Consolas', monospace; font-size: .78rem;
}
.aglab-wintitle { flex: 1; letter-spacing: .04em; }
.aglab-winbar button {
	width: 2rem; height: 2rem; flex: none;
	border: 1px solid #1b3a4b; background: transparent; color: #1b3a4b;
	border-radius: .3rem; cursor: pointer; font-family: inherit;
	font-size: .9rem; line-height: 1; padding: 0;
}
.aglab-winbar button:hover { background: var(--aglab-cyan); }
.aglab-win .aglab-viewport {
	position: relative; width: 100%; margin: 0;
	aspect-ratio: 814.82 / 620.11;
	cursor: move; touch-action: none;
}
.aglab-win .aglab-content { cursor: auto; touch-action: auto; }
.aglab-win .aglab-frame-tv { display: none; }
.aglab-win .aglab-frame-popup { display: block; }
.aglab-win .aglab-content {
	left: 3.6%; top: 4.2%; width: 92.7%; height: 91.3%;
	font-size: clamp(.95rem, 2vh, 1.15rem);
}
.aglab-dock {
	position: fixed; right: 6rem; bottom: 0; z-index: 99995;
	display: inline-flex; align-items: center; gap: .45rem;
	background: #16181a; color: #e8e6e0;
	border: 2px solid var(--aglab-cyan, #17bebb); border-bottom: none;
	border-radius: .6rem .6rem 0 0;
	padding: .5rem 1rem; cursor: pointer;
	font-family: 'MatrixSans', 'Consolas', monospace; font-size: .8rem;
}
.aglab-dock svg { width: 1em; height: 1.25em; }
.aglab-dock:hover { border-color: var(--aglab-green, #8ac926); }
.aglab-dock:focus-visible, .aglab-winbar button:focus-visible {
	outline: 3px solid #e25822; outline-offset: 2px;
}

/* ---------- habillage CLASSIQUE : le même écran, en civil ----------
   Une classe et des variables : conversation, fenêtré, onglet et mémoire
   fonctionnent à l'identique. Aucune fonction ne vit dans un habillage. */
.aglab--classic {
	--aglab-text: #26292c;
	--aglab-green: #1f8f4d;
	--aglab-orange: #b45309;
	--aglab-font: 'Poppins', Helvetica, Arial, sans-serif;
}
.aglab--classic .aglab-frame { display: none !important; }
.aglab--classic .aglab-viewport {
	aspect-ratio: auto;
	width: min(34rem, 100%);
	background: #fff;
	border: 2px solid var(--aglab-cyan);
	border-radius: .75rem;
	box-shadow: 0 .3rem .8rem rgba(0, 0, 0, .12);
}
.aglab--classic .aglab-content {
	position: relative; left: 0; top: 0; width: 100%;
	height: 30rem; font-size: 1rem;
}
.aglab--classic .aglab-content::before { display: none !important; }
.aglab--classic .aglab-inputrow { border-top-color: rgba(38, 41, 44, .15); }
.aglab--classic .aglab-input::placeholder { color: rgba(38, 41, 44, .5); }
.aglab--classic .aglab-who svg { filter: invert(1); }
.aglab--classic .aglab-cursor::after { content: ""; }
.aglab-win.aglab--classic { width: min(60vw, 38rem, calc(100vw - 2rem)); }
.aglab-win.aglab--classic .aglab-viewport { width: 100%; }
.aglab-win.aglab--classic .aglab-content { height: min(62vh, 34rem); }

/* ---------- MOBILE : la fenêtre devient PLEIN ÉCRAN (— et ✕ seulement) ---------- */
html.aglab-noscroll, html.aglab-noscroll body { overflow: hidden !important; }
.aglab-winnote { display: none; }
.aglab-win--full {
	top: 0; left: 0; transform: none;
	width: 100vw; height: 100%;
	max-height: none; min-width: 0;
	z-index: 100000; filter: none;
}
.aglab-win--full .aglab-winbar { border-radius: 0; border-left: none; border-right: none; }
.aglab-win--full .aglab-winnote {
	display: block;
	background: #eae2b7; color: #1b3a4b;
	font-size: .72rem; line-height: 1.35;
	padding: .3rem .8rem .45rem;
	border-bottom: 2px solid #1b3a4b;
	font-family: 'MatrixSans', 'Consolas', monospace;
}
.aglab-win--full .aglab-viewport {
	flex: 1; width: 100%; min-height: 0;
	aspect-ratio: auto; cursor: auto;
	background: #141618;
	border: .3rem solid var(--aglab-cyan); border-top: none;
}
.aglab-win--full .aglab-frame { display: none; }
.aglab-win--full .aglab-content {
	left: 2.5%; top: 1.8%; width: 95%; height: 96.4%;
	font-size: 1rem;
}
.aglab-win--full.aglab--classic .aglab-viewport { background: #fff; }

/* ---------- accessibilité : réduction des animations système ---------- */
@media (prefers-reduced-motion: reduce) {
	.aglab *, .aglab *::before, .aglab *::after { animation: none !important; transition: none !important; }
}