/* ==========================================================================
   SIMPLE Library — feuille de style
   Tout est encapsulé sous .slib. Les couleurs arrivent en variables CSS
   posées par le plugin sur l'enveloppe (onglet Apparence) ; les valeurs
   ci-dessous ne servent que de repli.
   ========================================================================== */

.slib {
	--sl-accent: #0b6ec7;
	--sl-accent-dark: #09569b;
	--sl-accent-soft: #e2eef9;
	--sl-accent-ring: #aacdee;
	--sl-on-accent: #ffffff;
	--sl-head: #0b6ec7;
	--sl-head-dark: #074780;
	--sl-head-light: #549ad8;
	--sl-on-head: #ffffff;
	--sl-page: #f4f8fb;
	--sl-card: #ffffff;
	--sl-zone: #f3f8fc;
	--sl-text: #12212e;
	--sl-muted: #5d6f7f;
	--sl-line: #dde3e8;
	--sl-danger: #d6394a;
	--sl-ok: #16a56b;

	--sl-font: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	--sl-t1: clamp(1.6em, 1.1em + 1.6vw, 2.3em);
	--sl-t2: 1.32em;
	--sl-t3: 1.05em;
	--sl-small: .94em;
	--sl-mini: .86em;
	--sl-bold: 800;
	--sl-radius: 14px;
	--sl-radius-s: 9px;
	--sl-pill: 999px;
	--sl-pad-x: 28px;
	--sl-shadow: 0 1px 2px rgba(10, 30, 50, .06), 0 8px 24px rgba(10, 30, 50, .08);
	--sl-shadow-strong: 0 2px 4px rgba(10, 30, 50, .08), 0 18px 44px rgba(10, 30, 50, .16);

	max-width: 1180px;
	margin-left: auto;
	margin-right: auto;
	padding: 8px 16px 56px;
	color: var(--sl-text);
	font-size: max(14px, 1em);
	font-weight: 400;
	line-height: 1.55;
	font-family: var(--sl-font);
	-webkit-font-smoothing: antialiased;
	text-align: left;
}

.slib *,
.slib *::before,
.slib *::after { box-sizing: border-box; }

/* Aucune puce : certains thèmes en ajoutent à toutes les listes du contenu. */
.slib ul,
.slib ol,
.slib li {
	list-style: none !important;
	margin-left: 0;
	padding-left: 0;
}
.slib li::marker { content: none; }
.slib .sl-grid > li::before { content: none !important; display: none !important; }

/* Neutralise capitales, centrage et polices imposés par certains thèmes. */
.slib h2, .slib h3, .slib p, .slib span, .slib a, .slib label, .slib input, .slib button,
.slib select, .slib textarea, .slib legend, .slib li, .slib th, .slib td, .slib summary, .slib time {
	text-transform: none;
	font-variant: normal;
	letter-spacing: normal;
	font-family: var(--sl-font);
}
.slib h2, .slib h3, .slib p, .slib label, .slib legend, .slib li, .slib th, .slib td { text-align: left; }

.slib img, .slib svg { max-width: 100%; }

.slib .sl-sr {
	position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; padding: 0; margin: -1px;
}
.slib .sl-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.slib--js .sl-nojs { display: none !important; }

/* ------------------------------------------------------------------ En-tête */

.sl-header {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	justify-content: space-between;
	gap: 18px;
	padding: 26px var(--sl-pad-x);
	margin-bottom: 20px;
	border-radius: var(--sl-radius);
	background: var(--sl-head);
	color: var(--sl-on-head);
	box-shadow: var(--sl-shadow);
}
.slib--gradient .sl-header { background: linear-gradient(135deg, var(--sl-head-dark), var(--sl-head) 55%, var(--sl-head-light)); }

.slib .sl-title {
	margin: 0;
	font-size: var(--sl-t1);
	font-weight: var(--sl-bold);
	line-height: 1.15;
	letter-spacing: -.02em;
	color: var(--sl-on-head);
}
.slib .sl-subtitle {
	margin: 6px 0 0;
	font-size: var(--sl-t3);
	font-weight: 500;
	color: var(--sl-on-head);
	opacity: .9;
}
.sl-header__text { flex: 1 1 auto; min-width: 0; }
.sl-header__actions { display: flex; flex-wrap: wrap; gap: 10px; }
.sl-header--logo { align-items: center; }

.sl-logo {
	flex: 0 0 auto;
	width: 62px;
	height: 62px;
	display: grid;
	place-items: center;
	font-size: 1.9em;
	border-radius: var(--sl-radius);
	background: rgba(255, 255, 255, .18);
	border: 1px solid rgba(255, 255, 255, .32);
}

/* Barre sans bandeau. */
.sl-bar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: 10px 18px;
	margin-bottom: 16px;
	padding-bottom: 12px;
	border-bottom: 1px solid var(--sl-line);
}
.slib .sl-bar__count { margin: 0; color: var(--sl-muted); }
.slib .sl-bar__count strong { color: var(--sl-text); }
.sl-bar__actions { display: flex; flex-wrap: wrap; gap: 8px; }

/* ------------------------------------------------------------------ Boutons */

.slib .sl-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	padding: 10px 18px;
	border: 1px solid var(--sl-line);
	border-radius: var(--sl-pill);
	background: var(--sl-card);
	color: var(--sl-text);
	font-size: var(--sl-small);
	font-weight: 650;
	line-height: 1.2;
	text-decoration: none;
	white-space: nowrap;
	cursor: pointer;
	transition: transform .14s ease, box-shadow .18s ease, background .18s ease, color .18s ease;
	box-shadow: 0 1px 2px rgba(10, 30, 50, .08);
}
.slib .sl-btn:hover { transform: translateY(-1px); box-shadow: 0 6px 18px rgba(10, 30, 50, .16); }
.slib .sl-btn:focus-visible,
.slib a:focus-visible,
.slib summary:focus-visible { outline: 3px solid var(--sl-accent-ring); outline-offset: 2px; }

.slib .sl-btn--primary {
	border-color: transparent;
	background: var(--sl-accent) !important;
	color: var(--sl-on-accent) !important;
}
.slib .sl-btn--primary:hover { background: var(--sl-accent-dark) !important; }
/* Dans le bandeau, le bouton principal passe en inverse : il reste visible
   même quand le bandeau et l'accent ont la même couleur. */
.slib .sl-header .sl-btn--primary { background: var(--sl-on-head) !important; color: var(--sl-head) !important; }
.slib .sl-header .sl-btn--primary:hover { background: var(--sl-on-head) !important; opacity: .92; }

.slib a.sl-btn,
.slib a.sl-btn:hover,
.slib a.sl-btn:focus,
.slib a.sl-btn:visited { text-decoration: none !important; }

.slib .sl-btn--soft { background: var(--sl-accent-soft); border-color: transparent; color: var(--sl-accent-dark) !important; box-shadow: none; }
.slib .sl-btn--soft:hover { box-shadow: 0 4px 12px rgba(10, 30, 50, .10); }
.slib .sl-btn--ghost { background: transparent; border-color: currentColor; color: inherit; box-shadow: none; opacity: .85; }
.slib .sl-header .sl-btn--ghost { color: var(--sl-on-head); }
.slib .sl-panel .sl-btn--ghost,
.slib .sl-bar .sl-btn--ghost { color: var(--sl-muted); border-color: var(--sl-line); }

.slib .sl-btn--danger { color: var(--sl-danger); border-color: color-mix(in srgb, var(--sl-danger) 35%, transparent); box-shadow: none; }
.slib .sl-btn--danger:hover { background: var(--sl-danger); border-color: var(--sl-danger); color: #fff; }

.slib .sl-btn--block { width: 100%; }
.slib .sl-btn--big { padding: 13px 28px; font-size: 1em; }
.slib .sl-btn[disabled] { opacity: .6; cursor: wait; transform: none; }

.slib .sl-btn__size { font-weight: 500; opacity: .8; }
.slib .sl-btn svg { flex: 0 0 auto; max-width: none; }

/* ------------------------------------------------------------------ Messages */

.sl-notice {
	display: flex;
	gap: 12px;
	align-items: flex-start;
	padding: 14px 18px;
	margin: 0 0 18px;
	border-radius: var(--sl-radius-s);
	border: 1px solid var(--sl-line);
	background: var(--sl-card);
	box-shadow: var(--sl-shadow);
	font-size: .96em;
}
.slib .sl-notice p { margin: 0; }
.sl-notice__ico {
	position: relative;
	flex: 0 0 22px;
	width: 22px;
	height: 22px;
	margin-top: 1px;
	border-radius: 50%;
	background: var(--sl-accent);
}
.sl-notice__ico::after {
	content: "i";
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	color: #fff;
	font-weight: 800;
	font-size: .8em;
}
.sl-notice--ok { border-color: #b9e6d1; background: #f2fbf7; color: #12212e; }
.sl-notice--ok .sl-notice__ico { background: var(--sl-ok); }
.sl-notice--ok .sl-notice__ico::after { content: "✓"; }
.sl-notice--error { border-color: #f5cad0; background: #fef5f6; color: #12212e; }
.sl-notice--error .sl-notice__ico { background: var(--sl-danger); }
.sl-notice--error .sl-notice__ico::after { content: "!"; }
.sl-notice--info { border-color: var(--sl-accent-ring); background: var(--sl-accent-soft); color: #12212e; }
.slib .sl-notice__btn {
	display: inline-block;
	margin-top: 10px;
	padding: 8px 16px;
	border-radius: var(--sl-pill);
	background: var(--sl-accent);
	color: var(--sl-on-accent) !important;
	font-weight: 650;
	text-decoration: none !important;
}

/* ------------------------------------------------------------------ Recherche */

.sl-filters { margin: 0 0 18px; }
.sl-search { margin: 0 0 14px; }
.sl-search__box {
	display: flex;
	align-items: center;
	gap: 8px;
	padding: 6px 7px 6px 16px;
	background: var(--sl-card);
	border: 1px solid var(--sl-line);
	border-radius: var(--sl-pill);
	box-shadow: var(--sl-shadow);
}
.sl-search__box:focus-within { border-color: var(--sl-accent); box-shadow: 0 0 0 4px var(--sl-accent-soft), var(--sl-shadow); }
.sl-search__icon { display: flex; color: var(--sl-muted); }
.slib .sl-search input[type="search"] {
	flex: 1 1 auto;
	min-width: 0;
	margin: 0;
	padding: 8px 4px;
	border: 0;
	outline: 0;
	background: transparent;
	box-shadow: none;
	color: var(--sl-text);
	font-size: 1em;
}
.slib .sl-search input::placeholder { color: var(--sl-muted); opacity: .75; }
.slib .sl-search__clear { padding: 0 6px; color: var(--sl-muted); font-size: 1.4em; line-height: 1; text-decoration: none; }
.slib .sl-search__clear:hover { color: var(--sl-danger); }

/* ------------------------------------------------------------------ Catégories */

.slib .sl-cats {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 8px;
	margin: 0 0 12px;
	padding: 0;
	border: 0;
	min-width: 0;
}
.slib .sl-cat {
	--sl-cat: var(--sl-accent);
	--sl-on-cat: var(--sl-on-accent);
	position: relative;
	display: inline-flex;
	align-items: center;
	gap: 7px;
	margin: 0;
	padding: 7px 13px;
	border: 1px solid var(--sl-line);
	border-radius: var(--sl-pill);
	background: var(--sl-card);
	color: var(--sl-text);
	font-size: var(--sl-small);
	font-weight: 650;
	line-height: 1.2;
	text-decoration: none;
	cursor: pointer;
	user-select: none;
	transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.slib .sl-cat:hover { border-color: var(--sl-cat); }
.slib .sl-cat input { position: absolute; opacity: 0; width: 1px; height: 1px; pointer-events: none; }
.slib .sl-cat:focus-within { outline: 3px solid var(--sl-accent-ring); outline-offset: 2px; }
.sl-cat__dot { width: 9px; height: 9px; border-radius: 50%; background: var(--sl-cat); flex: 0 0 auto; }
.slib .sl-cat:not(.has-color) .sl-cat__dot { background: var(--sl-line); }
.slib .sl-cat__n { padding: 1px 7px; border-radius: var(--sl-pill); background: var(--sl-zone); color: var(--sl-muted); font-size: .84em; font-weight: 700; }
.slib .sl-cat.is-empty { opacity: .55; }
.slib .sl-cat.is-on { background: var(--sl-cat); border-color: var(--sl-cat); color: var(--sl-on-cat); }
.slib .sl-cat.is-on .sl-cat__dot { background: var(--sl-on-cat); }
.slib .sl-cat.is-on .sl-cat__n { background: rgba(255, 255, 255, .22); color: inherit; }
.slib .sl-cat--all.is-on { background: var(--sl-text); border-color: var(--sl-text); color: var(--sl-card); }

/* ------------------------------------------------------------------ Outils */

.sl-tools {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-start;
	gap: 10px 14px;
}
.sl-tools__right { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-left: auto; }

.slib .sl-more-btn.is-active { background: var(--sl-accent) !important; color: var(--sl-on-accent) !important; }
.slib .sl-more-btn[aria-expanded="true"] { box-shadow: 0 0 0 3px var(--sl-accent-ring); }
.slib:not(.slib--js) .sl-jsonly { display: none !important; }
.sl-more__panel {
	display: flex;
	flex-wrap: wrap;
	align-items: flex-end;
	gap: 6px 16px;
	margin: 12px 0 0;
	padding: 16px 18px 4px;
	background: var(--sl-card);
	border: 1px solid var(--sl-line);
	border-radius: var(--sl-radius);
	box-shadow: var(--sl-shadow);
}
.sl-more__panel[hidden] { display: none; }
.sl-more__panel .sl-field { flex: 1 1 170px; margin-bottom: 12px; }
.sl-more__actions { display: flex; align-items: center; gap: 14px; margin-bottom: 12px; }

.slib .sl-reset { align-self: center; color: var(--sl-muted); font-size: var(--sl-small); text-decoration: underline; text-underline-offset: 3px; }
.slib .sl-reset:hover { color: var(--sl-danger); }

.slib .sl-sort-select { display: inline-flex; align-items: center; gap: 8px; margin: 0; color: var(--sl-muted); font-size: var(--sl-small); font-weight: 600; }
.slib .sl-sort-select select {
	margin: 0;
	padding: 8px 32px 8px 12px;
	border: 1px solid var(--sl-line);
	border-radius: var(--sl-radius-s);
	background-color: var(--sl-card);
	color: var(--sl-text);
	font-size: 1em;
	font-weight: 600;
	line-height: 1.2;
	max-width: 230px;
}

.sl-view { display: inline-flex; padding: 3px; gap: 3px; border: 1px solid var(--sl-line); border-radius: var(--sl-pill); background: var(--sl-zone); }
.slib .sl-view__btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px;
	border-radius: var(--sl-pill);
	color: var(--sl-muted);
	font-size: var(--sl-small);
	font-weight: 650;
	text-decoration: none;
}
.slib .sl-view__btn:hover { color: var(--sl-accent-dark); }
.slib .sl-view__btn.is-on { background: var(--sl-card); color: var(--sl-accent-dark); box-shadow: 0 2px 8px rgba(10, 30, 50, .12); }

.slib .sl-guest {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 6px 8px;
	margin: 0 0 14px;
	color: var(--sl-muted);
	font-size: var(--sl-small);
}
.slib .sl-guest a { color: var(--sl-accent); font-weight: 700; }

/* ------------------------------------------------------------------ Pictogrammes */

.sl-file { --sl-file: #6b7a88; position: relative; display: inline-block; flex: 0 0 auto; line-height: 0; }
.sl-file svg { width: 100%; height: 100%; }
.sl-file__sheet { fill: color-mix(in srgb, var(--sl-file) 12%, #fff); stroke: var(--sl-file); stroke-width: 1.6; }
.sl-file__fold { fill: color-mix(in srgb, var(--sl-file) 35%, #fff); }
.slib .sl-file__ext {
	position: absolute;
	left: 0;
	right: 12%;
	bottom: 18%;
	padding: 1px 0;
	border-radius: 3px;
	background: var(--sl-file);
	color: #fff;
	font-size: 9px;
	font-weight: 800;
	line-height: 1.35;
	letter-spacing: .03em;
	text-align: center;
}
.sl-file--s { width: 30px; height: 36px; }
.sl-file--m { width: 44px; height: 53px; }
.slib .sl-file--m .sl-file__ext { font-size: 11px; }
.slib .sl-file--x4 .sl-file__ext { font-size: 7px; letter-spacing: 0; }
.slib .sl-file--m.sl-file--x4 .sl-file__ext { font-size: 9.5px; }
.sl-file--pdf { --sl-file: #d6394a; }
.sl-file--text { --sl-file: #2b6fd6; }
.sl-file--sheet { --sl-file: #16895a; }
.sl-file--slides { --sl-file: #e0761b; }
.sl-file--image { --sl-file: #8a4fd6; }
.sl-file--archive { --sl-file: #6b7a88; }

.slib .sl-chip {
	--sl-chip: var(--sl-muted);
	--sl-chip-soft: var(--sl-zone);
	--sl-chip-text: var(--sl-text);
	display: inline-block;
	padding: 3px 10px;
	border-radius: var(--sl-pill);
	background: var(--sl-chip-soft);
	color: var(--sl-chip-text);
	box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--sl-chip) 30%, transparent);
	font-size: .84em;
	font-weight: 700;
	line-height: 1.35;
	white-space: nowrap;
}
.slib .sl-chip--none { font-style: italic; opacity: .8; }

.slib .sl-edit {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: var(--sl-muted);
	font-size: var(--sl-mini);
	font-weight: 650;
	text-decoration: none;
}
.slib .sl-edit:hover { color: var(--sl-accent); }

/* ------------------------------------------------------------------ Liste */

.sl-table-wrap {
	background: var(--sl-card);
	border: 1px solid var(--sl-line);
	border-radius: var(--sl-radius);
	box-shadow: var(--sl-shadow);
	overflow: hidden;
}
.slib .sl-table {
	width: 100%;
	margin: 0;
	border: 0;
	border-collapse: collapse;
	table-layout: auto;
	font-size: 1em;
	background: transparent;
}
.slib .sl-table th,
.slib .sl-table td {
	padding: 12px 14px;
	border: 0;
	border-bottom: 1px solid var(--sl-line);
	background: transparent;
	vertical-align: middle;
	color: var(--sl-text);
}
.slib .sl-table tbody tr:last-child td { border-bottom: 0; }
.slib .sl-table tbody tr { transition: background .12s ease; }
.slib .sl-table tbody tr:hover td { background: var(--sl-zone); }
.slib .sl-table thead th {
	padding-top: 11px;
	padding-bottom: 11px;
	background: var(--sl-zone);
	color: var(--sl-muted);
	font-size: var(--sl-mini);
	font-weight: 700;
	white-space: nowrap;
}
.slib .sl-table thead th a { color: inherit; text-decoration: none; }
.slib .sl-table thead th a:hover,
.slib .sl-table thead th.is-sorted a { color: var(--sl-accent-dark); }
.slib .sl-sort { opacity: .5; font-weight: 400; }
.slib .is-sorted .sl-sort { opacity: 1; }
.slib .sl-col-date { width: 1%; white-space: nowrap; color: var(--sl-muted); font-variant-numeric: tabular-nums; }
.slib td.sl-col-date { color: var(--sl-muted); }
.slib .sl-col-category { width: 1%; white-space: nowrap; }
.slib .sl-col-author { color: var(--sl-muted); font-size: var(--sl-small); }
.slib td.sl-col-author { color: var(--sl-muted); }
.slib .sl-col-action { width: 1%; white-space: nowrap; text-align: right; }

.sl-doc { display: flex; align-items: center; gap: 12px; min-width: 0; }
.sl-doc__text { min-width: 0; }
.slib .sl-doc__title { display: block; font-weight: 700; line-height: 1.3; overflow-wrap: anywhere; }
.slib .sl-doc__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 2px 8px; margin-top: 2px; color: var(--sl-muted); font-size: var(--sl-mini); }

.slib .sl-btn--compact { padding: 8px 14px; font-size: var(--sl-mini); }

/* ------------------------------------------------------------------ Mosaïque */

.slib .sl-grid {
	margin: 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
	gap: 18px;
}
.slib .sl-grid--solo { grid-template-columns: minmax(0, 340px); }

.slib .sl-card {
	display: flex;
	flex-direction: column;
	margin: 0;
	padding: 18px 18px 16px;
	background: var(--sl-card);
	border: 1px solid var(--sl-line);
	border-radius: var(--sl-radius);
	box-shadow: var(--sl-shadow);
	transition: transform .18s ease, box-shadow .22s ease;
}
.slib .sl-card:hover { transform: translateY(-3px); box-shadow: var(--sl-shadow-strong); }
.sl-card__top { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 14px; }
.slib .sl-card__title {
	margin: 0 0 6px;
	font-size: 1.08em;
	font-weight: var(--sl-bold);
	line-height: 1.28;
	color: var(--sl-text);
	overflow-wrap: anywhere;
}
.slib .sl-card__meta { margin: 0 0 14px; color: var(--sl-muted); font-size: var(--sl-small); }
.slib .sl-card__author { display: block; }
.sl-card__foot { display: flex; flex-direction: column; align-items: stretch; gap: 8px; margin-top: auto; }
/* Bouton de la carte : toute la largeur, texte centré, retour à la ligne permis
   (« Se connecter pour télécharger » ne déborde plus d'une carte étroite). */
.slib .sl-card__foot .sl-btn { width: 100%; white-space: normal; text-align: center; line-height: 1.3; }
.slib .sl-card__foot .sl-btn__label { min-width: 0; }
.slib .sl-card__foot .sl-edit { align-self: center; }

/* ------------------------------------------------------------------ Pagination */

.sl-pager { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; margin-top: 28px; }
.slib .sl-page {
	min-width: 42px;
	padding: 9px 12px;
	border: 1px solid var(--sl-line);
	border-radius: var(--sl-radius-s);
	background: var(--sl-card);
	color: var(--sl-text);
	font-weight: 650;
	text-align: center;
	text-decoration: none;
}
.slib a.sl-page:hover { border-color: var(--sl-accent); color: var(--sl-accent); }
.slib .sl-page.is-active { background: var(--sl-accent); border-color: transparent; color: var(--sl-on-accent); }
.slib .sl-page--gap { border-color: transparent; background: transparent; min-width: 0; padding-left: 4px; padding-right: 4px; }

/* ------------------------------------------------------------------ État vide */

.sl-empty {
	padding: 60px 24px;
	background: var(--sl-card);
	border: 1px dashed var(--sl-line);
	border-radius: var(--sl-radius);
	text-align: center;
}
.slib .sl-empty * { text-align: center; }
.sl-empty__icon { margin-bottom: 12px; font-size: 3em; line-height: 1; }
.slib .sl-empty h3 { margin: 0 0 6px; font-size: var(--sl-t2); font-weight: var(--sl-bold); }
.slib .sl-empty p { margin: 0 0 20px; color: var(--sl-muted); font-size: var(--sl-small); }

/* ------------------------------------------------------------------ Panneaux */

.sl-panel {
	max-width: 480px;
	margin: 0 auto;
	padding: 30px 30px 26px;
	background: var(--sl-card);
	border: 1px solid var(--sl-line);
	border-radius: var(--sl-radius);
	box-shadow: var(--sl-shadow-strong);
}
.sl-panel--form { max-width: 720px; }
.slib .sl-panel__title { margin: 0 0 18px; font-size: var(--sl-t2); font-weight: var(--sl-bold); }
.slib .sl-panel__title--center { text-align: center; }
.slib .sl-panel__help { margin: 0 0 20px; color: var(--sl-muted); font-size: var(--sl-small); }

.sl-tabs {
	display: flex;
	gap: 4px;
	padding: 4px;
	margin-bottom: 22px;
	background: var(--sl-zone);
	border: 1px solid var(--sl-line);
	border-radius: var(--sl-pill);
}
.slib .sl-tab {
	flex: 1;
	padding: 10px 12px;
	border-radius: var(--sl-pill);
	color: var(--sl-muted);
	font-size: var(--sl-small);
	font-weight: 700;
	text-align: center;
	text-decoration: none;
}
.slib .sl-tab:hover { color: var(--sl-accent); }
.slib .sl-tab.is-active { background: var(--sl-card); color: var(--sl-accent-dark); box-shadow: 0 2px 8px rgba(10, 30, 50, .12); }

/* ------------------------------------------------------------------ Formulaires */

.sl-cols { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 0 20px; }
.sl-field { margin-bottom: 18px; }
.slib .sl-field label {
	display: block;
	margin-bottom: 6px;
	color: var(--sl-text);
	font-size: var(--sl-mini);
	font-weight: 700;
}
.slib .sl-field input[type="text"],
.slib .sl-field input[type="email"],
.slib .sl-field input[type="password"],
.slib .sl-field input[type="date"],
.slib .sl-field select,
.slib .sl-field textarea {
	width: 100%;
	margin: 0;
	padding: 11px 14px;
	border: 1px solid var(--sl-line);
	border-radius: var(--sl-radius-s);
	background-color: var(--sl-card);
	color: var(--sl-text);
	font-size: 1em;
	line-height: 1.4;
	box-shadow: none;
	min-height: 46px;
}
.slib .sl-field input:focus,
.slib .sl-field select:focus,
.slib .sl-field textarea:focus,
.slib .sl-sort-select select:focus { outline: 0; border-color: var(--sl-accent); box-shadow: 0 0 0 4px var(--sl-accent-soft); }
.slib .sl-field input::placeholder { color: var(--sl-muted); opacity: .7; }
.slib .sl-field small { display: block; margin-top: 6px; color: var(--sl-muted); font-size: var(--sl-mini); }
.slib .sl-field small.is-error { color: var(--sl-danger); font-weight: 650; }

.slib .sl-tag {
	display: inline-block;
	margin-left: 6px;
	padding: 1px 7px;
	border-radius: var(--sl-pill);
	background: var(--sl-zone);
	color: var(--sl-muted);
	font-size: .9em;
	font-weight: 600;
	vertical-align: 1px;
}

.sl-check { display: flex; align-items: center; gap: 9px; margin: -4px 0 20px; color: var(--sl-muted); font-size: .94em; cursor: pointer; }
.sl-check input { width: 18px; height: 18px; margin: 0; accent-color: var(--sl-accent); }

/* Zone de dépôt du fichier : le vrai champ couvre toute la zone (clic et glisser-déposer). */
.sl-drop {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	min-height: 96px;
	padding: 18px;
	border: 2px dashed var(--sl-accent-ring);
	border-radius: var(--sl-radius);
	background: var(--sl-zone);
	color: var(--sl-accent-dark);
	font-weight: 700;
	text-align: center;
	transition: background .15s ease, border-color .15s ease;
}
.sl-drop:hover,
.sl-drop.is-over { border-color: var(--sl-accent); background: var(--sl-accent-soft); }
.sl-drop.has-file { border-style: solid; border-color: var(--sl-accent); }
.sl-drop:focus-within { outline: 3px solid var(--sl-accent-ring); outline-offset: 2px; }
.slib .sl-drop input[type="file"] { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.sl-drop__ico { display: flex; }
.slib .sl-drop__label { overflow-wrap: anywhere; }

.sl-current { display: flex; align-items: center; gap: 10px; margin: 0 0 10px; color: var(--sl-muted); font-size: var(--sl-small); }

.sl-progress { height: 8px; margin: 4px 0 18px; overflow: hidden; border-radius: var(--sl-pill); background: var(--sl-zone); }
.sl-progress[hidden] { display: none; }
.sl-progress span { display: block; width: 0; height: 100%; border-radius: inherit; background: var(--sl-accent); transition: width .2s ease; }

.sl-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 6px; }
.sl-delete { margin: 22px 0 0; padding-top: 18px; border-top: 1px solid var(--sl-line); }

.slib .sl-links { margin: 18px 0 0; color: var(--sl-muted); font-size: var(--sl-mini); text-align: center; }
.slib .sl-links a { color: var(--sl-accent); text-decoration: none; }
.slib .sl-links a:hover { text-decoration: underline; }
.slib .sl-links span { margin: 0 6px; opacity: .5; }
.slib .sl-links--2fa { margin-top: 12px; }

/* ==================================================================
   Mode « hériter du thème » : police, texte et fond viennent du thème ;
   le plugin ne garde que la mise en page, l'accent et le bandeau.
   ================================================================= */

.slib--theme {
	--sl-font: inherit;
	--sl-card: transparent;
	--sl-zone: rgba(128, 128, 128, .07);
	--sl-line: rgba(128, 128, 128, .28);
	--sl-text: inherit;
	--sl-muted: inherit;
	--sl-shadow: none;
	--sl-shadow-strong: none;
	font-size: inherit;
	line-height: inherit;
	color: inherit;
	max-width: none;
	padding-left: 0;
	padding-right: 0;
}
.slib--theme .sl-field small,
.slib--theme .sl-panel__help,
.slib--theme .sl-doc__meta,
.slib--theme .sl-card__meta,
.slib--theme .sl-col-date,
.slib--theme .sl-col-author,
.slib--theme .sl-empty p,
.slib--theme .sl-links,
.slib--theme .sl-guest { opacity: .72; }
.slib--theme .sl-card:hover { transform: none; }
.slib--theme .sl-field input,
.slib--theme .sl-field select,
.slib--theme .sl-sort-select select { background-color: transparent; color: inherit; }
.slib--theme .sl-search__box { background: transparent; }
.slib--theme .sl-tab.is-active,
.slib--theme .sl-view__btn.is-on { background: rgba(128, 128, 128, .16); color: inherit; }
.slib--theme .sl-btn { color: inherit; background: transparent; }
.slib--theme .sl-btn--soft { background: var(--sl-accent-soft) !important; color: var(--sl-accent-dark) !important; }
/* Pastille « Tout » active : couleurs de l'accent (en mode thème, le fond des
   blocs est transparent, et « Tout » devenait un rectangle blanc sans texte). */
.slib--theme .sl-cat--all.is-on { background: var(--sl-accent); border-color: var(--sl-accent); color: var(--sl-on-accent); }
.slib--theme .sl-more__panel { background: var(--sl-zone); }

/* Liste empilée (aperçu de l'administration ; même rendu que sur téléphone). */
.slib .sl-table--stack thead { display: none; }
.slib .sl-table--stack,
.slib .sl-table--stack tbody { display: block; }
.slib .sl-table--stack tr {
	display: grid;
	grid-template-columns: 1fr auto;
	grid-template-areas: "title title" "date act" "cat act" "author act";
	gap: 4px 12px;
	padding: 14px 14px;
	border-bottom: 1px solid var(--sl-line);
}
.slib .sl-table--stack tbody tr:last-child { border-bottom: 0; }
.slib .sl-table--stack td { display: block; padding: 0; border: 0; width: auto; text-align: left; }
.slib .sl-table--stack .sl-col-title { grid-area: title; margin-bottom: 4px; }
.slib .sl-table--stack .sl-col-date { grid-area: date; font-size: var(--sl-small); }
.slib .sl-table--stack .sl-col-category { grid-area: cat; }
.slib .sl-table--stack .sl-col-author { grid-area: author; }
.slib .sl-table--stack .sl-col-author:empty { display: none; }
.slib .sl-table--stack .sl-col-action { grid-area: act; align-self: end; }
.slib .sl-table--stack tbody tr:hover td { background: transparent; }

/* ------------------------------------------------------------------ Mobile */

@media (max-width: 760px) {
	.slib { padding: 4px 12px 40px; --sl-pad-x: 20px; }
	.sl-header { padding: 20px var(--sl-pad-x); }
	.sl-header__actions { width: 100%; }
	.sl-header__actions .sl-btn { flex: 1; }
	.sl-panel { padding: 24px 20px; }
	.sl-tools__right { margin-left: 0; width: 100%; justify-content: space-between; }
	.slib .sl-view__btn span { display: none; }
	.slib .sl-search__btn { padding: 10px 14px; }

	/* La liste devient une pile de lignes lisibles. */
	.slib .sl-table thead { display: none; }
	.slib .sl-table,
	.slib .sl-table tbody { display: block; }
	.slib .sl-table tr {
		display: grid;
		grid-template-columns: 1fr auto;
		grid-template-areas: "title title" "date act" "cat act" "author act";
		gap: 4px 12px;
		padding: 14px 14px;
		border-bottom: 1px solid var(--sl-line);
	}
	.slib .sl-table tbody tr:last-child { border-bottom: 0; }
	.slib .sl-table td { display: block; padding: 0; border: 0; width: auto; text-align: left; }
	.slib .sl-table .sl-col-title { grid-area: title; margin-bottom: 4px; }
	.slib .sl-table .sl-col-date { grid-area: date; font-size: var(--sl-small); }
	.slib .sl-table .sl-col-category { grid-area: cat; }
	.slib .sl-table .sl-col-author { grid-area: author; }
	.slib .sl-table .sl-col-author:empty { display: none; }
	.slib .sl-table .sl-col-action { grid-area: act; align-self: end; }
	.slib .sl-table tbody tr:hover td { background: transparent; }
	.slib .sl-btn--compact .sl-btn__label { display: none; }
	.slib .sl-btn--compact { padding: 11px; }
	.slib .sl-grid { grid-template-columns: 1fr; }
}

@media (min-width: 761px) {
	/* Sur grand écran, la liste montre le libellé seul pour « Se connecter… » trop long. */
	.slib .sl-btn--locked.sl-btn--compact .sl-btn__label { display: none; }
	.slib .sl-btn--locked.sl-btn--compact { padding: 8px 11px; }
}

@media (prefers-reduced-motion: reduce) {
	.slib *, .slib *::before, .slib *::after { transition: none !important; animation: none !important; }
}