/* ========================================================= PAGE — ADMINISTRATION ========================================================= */ @import url('CSSPlongeeAccueil.css'); /* Cette page a un

et un
qui sont PAS dans un
(H1 et NAV sont directement enfants de ). On restaure donc des marges explicites. / body > h1 { max-width: 1180px; margin: 2.5rem auto 1rem; padding: 0 clamp(1rem, 3vw, 2.25rem); background: linear-gradient(135deg, #fff, #8fd6e8); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; animation: rise .6s var(--ease) both; } / Navigation de sections (sous-onglets) / body > nav { max-width: 1180px; margin: 0.5rem auto; padding: 8px clamp(1rem, 3vw, 2.25rem); display: flex; flex-wrap: wrap; gap: 6px; align-items: center; color: transparent; / masque les "|" séparateurs / font-size: 0; } body > nav a { font-size: 0.85rem; color: var(--text-muted); text-decoration: none; padding: 10px 20px; border-radius: 999px; background: var(--surface); border: 1px solid var(--border); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); font-weight: 500; transition: all .25s var(--ease); } body > nav a:hover { color: #fff; border-color: var(--accent); background: rgba(34,211,238,0.08); transform: translateY(-1px); } body > hr { max-width: 1180px; margin: 1rem auto 1.5rem; padding: 0 clamp(1rem, 3vw, 2.25rem); background: linear-gradient(90deg, transparent, var(--border-strong), transparent); } / Conteneur principal : tout le contenu echoed par PHP est au body directement / body > h2, body > h3, body > table, body > form, body > p { max-width: 1180px; margin-left: auto; margin-right: auto; padding-left: clamp(1rem, 3vw, 2.25rem); padding-right: clamp(1rem, 3vw, 2.25rem); width: 100%; } body > h2 { margin-top: 2.5rem; margin-bottom: 1.25rem; font-size: 1.75rem; background: linear-gradient(135deg, #fff, #8fd6e8); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; } body > h3 { margin-top: 2rem; margin-bottom: 0.9rem; color: var(--accent); font-size: 1rem; text-transform: uppercase; letter-spacing: 0.14em; font-weight: 700; } / --------- Formulaires inline (ajout / modif) --------- / body > form { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; padding-top: 1.25rem; padding-bottom: 1.25rem; margin-top: 0.25rem; margin-bottom: 1.25rem; background: var(--surface); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border: 1px solid var(--border); border-radius: var(--radius-lg); max-width: 1180px; color: var(--text-muted); font-size: 0.88rem; } body > form input[type="text"], body > form input[type="email"], body > form input[type="date"], body > form input[type="number"] { padding: 10px 14px; background: rgba(4,8,15,0.6); border: 1px solid var(--border); border-radius: var(--radius-sm); color: #fff; font-family: inherit; font-size: 0.9rem; min-width: 140px; transition: all .2s var(--ease); color-scheme: dark; } body > form input:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px rgba(34,211,238,0.18); } body > form input[type="submit"] { background: linear-gradient(135deg, var(--accent), var(--accent-2)); color: #04131a; border: none; padding: 10px 22px; border-radius: var(--radius-sm); font-family: 'Syne', sans-serif; font-weight: 700; font-size: 0.78rem; letter-spacing: 0.12em; text-transform: uppercase; cursor: pointer; box-shadow: 0 8px 20px -8px rgba(34,211,238,0.55); transition: transform .2s var(--ease), filter .2s var(--ease), box-shadow .2s var(--ease); } body > form input[type="submit"]:hover { transform: translateY(-1px); filter: brightness(1.08); box-shadow: 0 14px 28px -8px rgba(34,211,238,0.75); } / --------- Tableaux --------- / body > table { border-collapse: separate; border-spacing: 0; background: var(--surface); backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px); border: 1px solid var(--border) !important; border-radius: var(--radius-lg); overflow: hidden; margin-top: 1rem; margin-bottom: 2.5rem; box-shadow: var(--shadow-1); font-size: 0.9rem; } body > table, body > table tr, body > table td, body > table th { border: none !important; } body > table th { background: linear-gradient(180deg, rgba(34,211,238,0.08), transparent); color: var(--accent); padding: 16px 18px; text-align: left; font-family: 'Syne', sans-serif; font-size: 0.72rem; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; border-bottom: 1px solid var(--border-strong) !important; } body > table td { padding: 14px 18px; color: var(--text); border-bottom: 1px solid var(--border) !important; font-size: 0.9rem; vertical-align: middle; } body > table tr:last-child td { border-bottom: none !important; } body > table tbody tr { transition: background .2s var(--ease); } body > table tbody tr:hover { background: rgba(34,211,238,0.04); } / Liens d'action dans les cellules (Modifier / Supprimer) / body > table td a { display: inline-block; color: var(--text-muted); text-decoration: none; font-size: 0.78rem; font-weight: 600; border: 1px solid var(--border); padding: 6px 12px; border-radius: 999px; margin: 2px 3px; transition: all .2s var(--ease); } body > table td a:hover { color: #04131a; background: var(--accent); border-color: var(--accent); transform: translateY(-1px); } / Lien "Supprimer" distinct (dernier lien de la cellule d'actions) / body > table td a[href="supprimer"], body > table td a[href="Supprimer"] { color: #fca5a5; border-color: rgba(239,68,68,0.35); } body > table td a[href="supprimer"]:hover, body > table td a[href="Supprimer"]:hover { color: #fff; background: linear-gradient(135deg, #ef4444, #dc2626); border-color: transparent; } / --------- Messages inline (succès vert) --------- / body > p[style="green"] { max-width: 1180px; padding: 14px 18px; margin: 1rem auto; background: rgba(16,185,129,0.1) !important; border: 1px solid rgba(16,185,129,0.35); color: #6ee7b7 !important; border-radius: var(--radius); font-weight: 500; } /* --------- Footer (direct enfant de body) --------- / body > footer { margin-top: 2rem; } / --------- Responsive tableaux --------- */ @media (max-width: 720px) { body > table { display: block; overflow-x: auto; white-space: nowrap; } body > form { flex-direction: column; align-items: stretch; } body > form input, body > form input[type="submit"] { width: 100%; } }