/* =========================
   RDR2 – ligne_gestion.css
   (cuir / laiton / parchemin / saloon)
========================= */
:root{
  --bg-0:#070604;
  --bg-1:#0c0906;
  --bg-2:#14100b;

  --panel-0:#15110c;
  --panel-1:#1d170f;

  --paper:#f2e5c9;
  --paper-soft:#e3d2b0;
  --paper-muted:#cbb58c;

  --gold:#c7a04e;
  --gold-strong:#e2c37a;
  --gold-line:rgba(199,160,78,.46);
  --gold-line-soft:rgba(199,160,78,.22);

  --wine:#6e2323;
  --wine-soft:rgba(110,35,35,.12);

  --shadow:0 18px 40px rgba(0,0,0,.62);
  --shadow-2:0 10px 18px rgba(0,0,0,.42);
  --radius:18px;
}

*{ box-sizing:border-box; }
html, body{ height:100%; }

body{
  margin:0;
  padding: 18px 16px 90px;
  color: var(--paper);
  background:
    radial-gradient(900px 600px at 20% 10%, rgba(199,160,78,.10), transparent 60%),
    radial-gradient(900px 650px at 82% 88%, rgba(110,35,35,.12), transparent 60%),
    repeating-linear-gradient(90deg, rgba(255,255,255,.012) 0 2px, transparent 2px 9px),
    linear-gradient(180deg, var(--bg-0), var(--bg-2));
  font-family: "Crimson Text", serif;
}

/* =========================
   NAV – barre cuir/laiton
========================= */
.menu-nav{
  width: 100%;
  border: 1px solid var(--gold-line);
  border-radius: var(--radius);
  background:
    radial-gradient(900px 220px at 50% 0%, rgba(199,160,78,.08), transparent 60%),
    linear-gradient(180deg, rgba(10,8,6,.94), rgba(18,14,10,.92));
  box-shadow: var(--shadow);
  margin: 0 auto 16px;
  max-width: 1100px;
}

.menu-nav ul{
  list-style:none;
  margin:0;
  padding: 10px 12px;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  justify-content:center;
  align-items:center;
}

.menu-nav li{ margin:0; padding:0; }

.menu-nav a{
  display:inline-block;
  text-decoration:none;
  color: var(--paper);
  padding: 9px 12px;
  border-radius: 999px;
  border: 1px solid rgba(199,160,78,.38);
  background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.015));
  box-shadow: var(--shadow-2);
  font-family: "Cinzel", serif;
  letter-spacing: .25px;
  font-size: 14px;
  transition: transform .12s ease, background .12s ease, border-color .12s ease, box-shadow .12s ease;
}

.menu-nav a:hover{
  transform: translateY(-1px);
  background: linear-gradient(180deg, rgba(199,160,78,.18), rgba(255,255,255,.02));
  border-color: rgba(226,195,122,.78);
  box-shadow: 0 14px 26px rgba(0,0,0,.55);
}

/* =========================
   CONTENU CENTRÉ
========================= */
.main-content{
  width: min(1100px, calc(100% - 16px));
  margin: 0 auto;
  padding: 16px 16px 18px;
  border-radius: var(--radius);
  background:
    radial-gradient(900px 340px at 18% 0%, rgba(199,160,78,.10), transparent 60%),
    radial-gradient(900px 340px at 86% 100%, rgba(110,35,35,.08), transparent 62%),
    linear-gradient(180deg, rgba(19,15,11,.78), rgba(28,22,16,.86));
  border: 1px solid var(--gold-line);
  box-shadow: var(--shadow);
  position: relative;
}

.main-content::before{
  content:"";
  position:absolute;
  inset:10px;
  border-radius: calc(var(--radius) - 8px);
  border: 1px solid var(--gold-line-soft);
  pointer-events:none;
}

h2{
  margin: 0 0 12px;
  padding: 12px 14px;
  border-radius: 14px;
  background:
    radial-gradient(900px 240px at 50% 0%, rgba(199,160,78,.10), transparent 60%),
    rgba(9,7,5,.35);
  border: 1px solid var(--gold-line-soft);
  font-family: "Almendra SC", "Cinzel", serif;
  letter-spacing: .6px;
  text-shadow: 0 2px 0 rgba(0,0,0,.6);
}

p{
  margin: 8px 0;
  color: var(--paper-soft);
}

p strong{ color: var(--paper); }

/* Liens (login/logout/modifier/supprimer) */
a{
  color: var(--gold-strong);
  text-decoration: none;
}
a:hover{
  text-decoration: underline;
}

/* =========================
   TABLE – style saloon
========================= */
table{
  width: 100%;
  border-collapse: collapse;
  margin-top: 12px;
  border-radius: 14px;
  overflow: hidden;
  border: 1px solid rgba(199,160,78,.28);
  background: rgba(8,7,5,.35);
}

thead th{
  position: sticky;
  top: 0;
  background:
    radial-gradient(900px 220px at 50% 0%, rgba(199,160,78,.12), transparent 60%),
    linear-gradient(180deg, rgba(199,160,78,.12), rgba(9,7,5,.92));
  border-bottom: 1px solid rgba(199,160,78,.38);
  padding: 12px 10px;
  text-align: left;
  color: var(--paper);
  font-family: "Cinzel", serif;
  letter-spacing: .55px;
  font-size: 15px;
}

tbody td{
  padding: 12px 10px;
  border-bottom: 1px solid rgba(199,160,78,.14);
  color: var(--paper-soft);
  font-size: 16px;
}

tbody tr:nth-child(even){
  background: rgba(110,35,35,.06);
}

tbody tr:hover{
  background: rgba(110,35,35,.14);
}

/* Colonne Actions */
tbody td:last-child{
  white-space: nowrap;
}

/* Le texte “connexion requise” */
tbody span{
  color: rgba(203,181,140,.70) !important;
}

/* =========================
   Bouton retour accueil
========================= */
.button-accueil{
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(199,160,78,.40);
  background:
    radial-gradient(700px 140px at 50% 0%, rgba(199,160,78,.10), transparent 64%),
    linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.015));
  cursor:pointer;
  font-size: 16px;
  color: var(--paper);
  font-family: "Cinzel", serif;
  letter-spacing: .25px;
  box-shadow: var(--shadow-2);
  transition: transform .12s ease, background .12s ease, border-color .12s ease, box-shadow .12s ease;
}

.button-accueil:hover{
  transform: translateY(-1px);
  background:
    radial-gradient(700px 140px at 50% 0%, rgba(110,35,35,.16), transparent 64%),
    linear-gradient(180deg, rgba(199,160,78,.16), rgba(255,255,255,.02));
  border-color: rgba(226,195,122,.84);
  box-shadow: 0 14px 26px rgba(0,0,0,.55);
}

/* =========================
   Footer
========================= */
.footer{
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 12px 14px;
  text-align:center;
  background:
    radial-gradient(900px 240px at 50% 0%, rgba(199,160,78,.10), transparent 60%),
    linear-gradient(180deg, rgba(10,8,6,.92), rgba(18,14,10,.92));
  border-top: 1px solid rgba(199,160,78,.35);
  color: var(--paper-muted);
  font-family: "Crimson Text", serif;
  box-shadow: 0 -12px 26px rgba(0,0,0,.55);
}

.footer strong{ color: var(--paper); }
.footer-icon{ color: var(--gold-strong); }

/* Sélection texte */
::selection{
  background: rgba(199,160,78,.28);
  color: var(--paper);
}

/* Responsive */
@media (max-width: 720px){
  body{ padding-bottom: 110px; }
  thead th{ font-size: 14px; }
  tbody td{ font-size: 15px; }
  tbody td:last-child{ white-space: normal; }
}