/* === Kaeoz Banner & Footer Modern Style === */
.kaeoz-banner {
	background: linear-gradient(90deg, #232946 60%, #313244 100%);
	color: #fff;
	box-shadow: 0 2px 12px rgba(35,41,70,0.10);
	padding: 0;
	border-bottom: 2px solid #eebbc3;
}
.kaeoz-banner-inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	max-width: 1200px;
	margin: 0 auto;
	padding: 0.7em 2em;
}
.kaeoz-logo-title {
	display: flex;
	align-items: center;
}
.kaeoz-logo {
	height: 48px;
	width: auto;
	border-radius: 8px;
	background: #fff2;
	box-shadow: 0 2px 8px #0002;
}
.kaeoz-title {
	font-size: 2em;
	font-weight: 700;
	letter-spacing: 1.5px;
	color: #eebbc3;
	text-shadow: 0 2px 8px #0002;
}
.kaeoz-nav {
	display: flex;
	gap: 1.2em;
}
.kaeoz-nav a {
	color: #eebbc3;
	text-decoration: none;
	font-weight: 500;
	padding: 0.5em 1.1em;
	border-radius: 6px;
	font-size: 1.08em;
	transition: background 0.2s, color 0.2s;
}
.kaeoz-nav a:hover, .kaeoz-nav a.active {
	background: #eebbc3;
	color: #232946;
}

.kaeoz-footer {
	background: #232946;
	color: #a6adc8;
	padding: 1.2em 0 0.7em 0;
	margin-top: 3em;
	border-top: 2px solid #eebbc3;
	box-shadow: 0 -2px 12px rgba(35,41,70,0.07);
}
.kaeoz-footer-inner {
	max-width: 1200px;
	margin: 0 auto;
	text-align: center;
	font-size: 1.08em;
}
.kaeoz-footer-brand {
	color: #eebbc3;
	font-weight: 600;
}
html {
	box-sizing: border-box;
	font-size: 16px;
}
*, *:before, *:after {
	box-sizing: inherit;
}
body {
	font-family: 'Segoe UI', Arial, sans-serif;
	background: linear-gradient(120deg, #f4f4f4 0%, #e9e9f7 100%);
	margin: 0;
	min-height: 100vh;
	color: #222;
}
header {
	background: #232946;
	color: #fff;
	padding: 1.2em 2em;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
	box-shadow: 0 2px 8px rgba(35,41,70,0.08);
}
header h1 {
	font-size: 1.6em;
	margin: 0;
	letter-spacing: 1px;
}
nav {
	display: flex;
	gap: 1.2em;
}
nav a {
	color: #eebbc3;
	text-decoration: none;
	font-weight: 500;
	padding: 0.4em 0.8em;
	border-radius: 4px;
	transition: background 0.2s, color 0.2s;
}
nav a:hover, nav a.active {
	background: #eebbc3;
	color: #232946;
}
main {
	padding: 2em 1em;
	max-width: 900px;
	margin: 2em auto;
	background: #fff;
	border-radius: 12px;
	box-shadow: 0 4px 24px rgba(35,41,70,0.07);
}
form {
	display: flex;
	flex-direction: column;
	gap: 1em;
	margin-bottom: 1.5em;
}
fieldset {
	border: 1px solid #eebbc3;
	border-radius: 8px;
	padding: 1em;
	margin-bottom: 1em;
	background: #f9f9fb;
}
legend {
	color: #232946;
	font-weight: bold;
	padding: 0 0.5em;
}
label {
	display: block;
	margin-bottom: 0.5em;
	font-weight: 500;
}
input[type="text"],
input[type="password"],
input[type="number"],
select {
	padding: 0.5em;
	border: 1px solid #b8c1ec;
	border-radius: 4px;
	font-size: 1em;
	width: 100%;
	margin-top: 0.2em;
}
select[multiple] {
	height: 4em;
}
button {
	background: #232946;
	color: #fff;
	border: none;
	border-radius: 4px;
	padding: 0.7em 1.5em;
	font-size: 1em;
	font-weight: 600;
	cursor: pointer;
	margin-top: 0.5em;
	transition: background 0.2s;
}
button:hover {
	background: #eebbc3;
	color: #232946;
}
.modal {
	display: none;
	position: fixed;
	z-index: 10;
	left: 0; top: 0; width: 100vw; height: 100vh;
	background: rgba(35,41,70,0.25);
	justify-content: center;
	align-items: center;
}
.modal-content {
	background: #fff;
	margin: auto;
	padding: 2em 1.5em;
	border-radius: 10px;
	box-shadow: 0 8px 32px rgba(35,41,70,0.15);
	width: 100%;
	max-width: 400px;
	position: relative;
}
.close {
	color: #b8c1ec;
	position: absolute;
	right: 1em;
	top: 0.7em;
	font-size: 2em;
	font-weight: bold;
	cursor: pointer;
}
#iaResult, #iaActions, #iaExplanation {
	margin-top: 1em;
	background: #f9f9fb;
	padding: 1em;
	border-radius: 6px;
	color: #232946;
	font-size: 1em;
}
#iaHistory {
	list-style: none;
	padding: 0;
}
#iaHistory li {
	background: #eebbc3;
	color: #232946;
	margin-bottom: 0.5em;
	padding: 0.5em 1em;
	border-radius: 4px;
	font-size: 0.97em;
}
footer {
	text-align: center;
	margin-top: 2em;
	color: #b8c1ec;
	font-size: 1em;
	padding: 1em 0 0.5em 0;
}
@media (max-width: 700px) {
	main {
		padding: 1em 0.2em;
		margin: 1em 0.2em;
		border-radius: 0;
		box-shadow: none;
	}
	header {
		flex-direction: column;
		align-items: flex-start;
		padding: 1em 0.7em;
	}
	nav {
		gap: 0.7em;
		flex-wrap: wrap;
	}
	.modal-content {
		padding: 1em 0.5em;
		max-width: 98vw;
	}
}

/* Hamburger menu styles (simple, inspired from EQUALIZ) */
.kaeoz-hamburger { display: none; }
.menu__toggle { display: none; }
.menu__btn { display: inline-block; width: 44px; height: 44px; position: relative; cursor: pointer; }
.menu__btn span,
.menu__btn span:before,
.menu__btn span:after { display: block; position: absolute; height: 3px; width: 100%; background: #eebbc3; left: 0; transition: transform .2s ease; }
.menu__btn span { top: 50%; transform: translateY(-50%); }
.menu__btn span:before { content: ''; top: -10px; }
.menu__btn span:after { content: ''; top: 10px; }
.menu__box { position: absolute; right: 1rem; top: 64px; background: #232946; border-radius: 8px; padding: 0.6rem 0; list-style: none; display: none; min-width: 160px; box-shadow: 0 6px 24px rgba(0,0,0,0.25); }
.menu__box .menu__item { display: block; padding: 0.6rem 1rem; color: #eebbc3; text-decoration: none; }
.menu__box .menu__item:hover { background: #eebbc3; color: #232946; }
.menu__li--admin { margin-top: 0.6rem; border-top: 1px solid #3a3f5a; }

@media (max-width: 700px) {
	.kaeoz-nav { display: none; }
	.kaeoz-hamburger { display: block; position: absolute; right: 1rem; top: 0.9rem; }
	.menu__toggle:checked + .menu__btn span { transform: rotate(45deg); }
	.menu__toggle:checked + .menu__btn span:before { transform: rotate(90deg) translateX(-1px); top: 0; }
	.menu__toggle:checked + .menu__btn span:after { transform: rotate(-90deg); top: 0; }
	.menu__toggle:checked ~ .menu__box { display: block; }
}
/* === Statut agent IA (badge dans le header) === */
.ia-status-badge {
    display: inline-flex;
    align-items: center;
    gap: .45em;
    margin-left: auto;
    margin-right: 1em;
    padding: .25em .7em;
    border-radius: 999px;
    font-size: .85em;
    font-weight: 500;
    line-height: 1;
    background: rgba(255,255,255,.08);
    color: #fff;
    border: 1px solid rgba(255,255,255,.18);
    user-select: none;
    transition: background .2s, border-color .2s;
}
.ia-status-dot {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #888;
    box-shadow: 0 0 0 0 rgba(255,255,255,.4);
}
.ia-status-online   { background: rgba(46,160,67,.18); border-color: rgba(46,160,67,.55); }
.ia-status-online   .ia-status-dot { background:#2ea043; box-shadow:0 0 6px rgba(46,160,67,.85); animation: ia-pulse 2s infinite; }
.ia-status-degraded { background: rgba(220,160,40,.18); border-color: rgba(220,160,40,.55); }
.ia-status-degraded .ia-status-dot { background:#dca028; }
.ia-status-offline  { background: rgba(218,54,51,.18);  border-color: rgba(218,54,51,.55); }
.ia-status-offline  .ia-status-dot { background:#da3633; }
.ia-status-unknown  { background: rgba(180,180,180,.15); border-color: rgba(180,180,180,.4); }
.ia-status-unknown  .ia-status-dot { background:#888; }
@keyframes ia-pulse {
    0%   { box-shadow: 0 0 0 0 rgba(46,160,67,.55); }
    70%  { box-shadow: 0 0 0 6px rgba(46,160,67,0);  }
    100% { box-shadow: 0 0 0 0 rgba(46,160,67,0);    }
}
@media (max-width: 700px) {
    .ia-status-badge .ia-status-label { display: none; }
    .ia-status-badge { padding: .35em; }
}


/* ============================================================== */
/* IA Régleur — session, tableau central, historique               */
/* ============================================================== */
.ia-regleur .ia-card { background:#fff; border:1px solid #d8dde3; border-radius:8px; padding:1em 1.2em; margin-bottom:1.2em; }
.ia-regleur .ia-help { color:#5b6471; font-size:.92em; margin:.4em 0 .8em; }
.ia-regleur h3 { margin-top:1.3em; border-bottom:1px solid #e6e9ee; padding-bottom:.3em; }
.ia-regleur h4 { margin:.8em 0 .3em; font-size:1em; }
.ia-regleur .ia-danger { background:#c0392b; color:#fff; border:none; padding:.45em .9em; border-radius:4px; cursor:pointer; }
.ia-regleur .ia-danger:hover { background:#a93226; }
.ia-regleur button { cursor:pointer; }

.ia-session-banner { display:flex; flex-wrap:wrap; align-items:center; gap:1em; padding:.6em .8em; background:#eef4fb; border-left:4px solid #2c7be5; border-radius:4px; margin-bottom:1em; }
.ia-session-banner > div { flex:1 1 auto; }
.ia-session-ctx { color:#3c4a5c; font-size:.92em; }

/* Tableau actionneurs (desktop) */
.ia-actuators-wrap { overflow-x:auto; }
.ia-actuators { width:100%; border-collapse:collapse; font-size:.93em; }
.ia-actuators th, .ia-actuators td { border-bottom:1px solid #e6e9ee; padding:.45em .55em; text-align:left; vertical-align:middle; }
.ia-actuators thead th { background:#f5f7fa; font-weight:600; }
.ia-actuators .col-num { text-align:right; font-variant-numeric:tabular-nums; }
.ia-actuators .col-apply { text-align:center; width:80px; }
.ia-actuators .col-group { width:120px; color:#5b6471; font-weight:600; }
.ia-actuators .param-unit { color:#7a8493; font-size:.85em; margin-left:.4em; }
.ia-actuators input[type=number] { width:100%; min-width:80px; max-width:120px; padding:.25em .35em; border:1px solid #c2c9d2; border-radius:3px; text-align:right; }
.ia-actuators .delta.pos { color:#1e7e34; font-weight:600; }
.ia-actuators .delta.neg { color:#c0392b; font-weight:600; }
.ia-actuators .suggested { color:#2c7be5; font-weight:600; }
.ia-actuators-actions { margin:.8em 0 1.2em; display:flex; gap:.6em; flex-wrap:wrap; }
.ia-actuators-actions button { padding:.5em 1em; }
#applySuggestedBtn { background:#2c7be5; color:#fff; border:none; border-radius:4px; }
#applySuggestedBtn:disabled { background:#a3b8d3; cursor:not-allowed; }

.ia-cycle-form fieldset { border:1px solid #d8dde3; border-radius:6px; padding:.7em 1em; margin-bottom:1em; }
.ia-cycle-form legend { font-weight:600; padding:0 .4em; }
.ia-cycle-form fieldset > label { display:inline-block; margin:.25em .8em .25em 0; font-size:.92em; }
.ia-cycle-form fieldset > label input, .ia-cycle-form fieldset > label select { margin-left:.3em; }
.ia-cycle-submit { display:flex; align-items:center; gap:1em; }
.ia-cycle-submit button { background:#1e7e34; color:#fff; border:none; padding:.55em 1.2em; border-radius:4px; }
.ia-inline-status { color:#5b6471; font-style:italic; }

.ia-suggestion-box { background:#fff8e1; border:1px solid #ecd97c; border-radius:6px; padding:.8em 1em; margin-top:1em; }
.ia-suggestion-box pre { white-space:pre-wrap; margin:.3em 0 .8em; font-family:inherit; }
.ia-feedback { display:flex; flex-wrap:wrap; gap:.5em; align-items:center; }
.ia-feedback button { padding:.45em .9em; border-radius:4px; border:1px solid #c2c9d2; background:#fff; }
.ia-feedback button[data-result=ok]         { border-color:#1e7e34; color:#1e7e34; }
.ia-feedback button[data-result=defaut]     { border-color:#c0392b; color:#c0392b; }
.ia-feedback button[data-result=correction] { border-color:#d68910; color:#d68910; }
.ia-feedback input[name=commentaire] { flex:1 1 200px; padding:.4em; border:1px solid #c2c9d2; border-radius:3px; }

.ia-history-wrap { overflow-x:auto; }
.ia-history { width:100%; border-collapse:collapse; font-size:.9em; }
.ia-history th, .ia-history td { border-bottom:1px solid #e6e9ee; padding:.4em .55em; vertical-align:top; }
.ia-history thead th { background:#f5f7fa; font-weight:600; }
.ia-history .verdict.ok       { color:#1e7e34; font-weight:600; }
.ia-history .verdict.rebut    { color:#c0392b; font-weight:600; }
.ia-history .verdict.defaut   { color:#c0392b; font-weight:600; }
.ia-history .verdict.correction { color:#d68910; font-weight:600; }
.ia-history .deltas { font-family:'SFMono-Regular',Consolas,monospace; font-size:.85em; }
.ia-history tr.empty td { text-align:center; color:#7a8493; font-style:italic; }

/* Mobile : transforme les tableaux en cartes */
@media (max-width: 720px) {
    .ia-actuators thead, .ia-history thead { display:none; }
    .ia-actuators, .ia-actuators tbody, .ia-actuators tr, .ia-actuators td,
    .ia-history,    .ia-history tbody,    .ia-history tr,    .ia-history td { display:block; width:100%; }
    .ia-actuators tr, .ia-history tr { background:#fff; border:1px solid #d8dde3; border-radius:6px; margin-bottom:.6em; padding:.5em .7em; }
    .ia-actuators td, .ia-history td { border:none; padding:.25em 0; display:flex; justify-content:space-between; gap:1em; }
    .ia-actuators td::before, .ia-history td::before {
        content: attr(data-label); font-weight:600; color:#5b6471; flex:0 0 45%;
    }
    .ia-actuators td.col-group:empty { display:none; }
    .ia-actuators input[type=number] { max-width:none; width:50%; }
    .ia-history td:first-child { font-weight:700; border-bottom:1px solid #e6e9ee; padding-bottom:.4em; margin-bottom:.4em; }
}