/* Variables, reset et elements generiques partages par les 3 pages
   (index/settings/inbox). Regles specifiques a chaque page : voir
   index.css / settings.css / inbox.css. Menu burger : voir nav.css. */

:root{
  --bg:#0d0f14; --bg2:#151922; --card:#1c2130; --line:#2a3142;
  --txt:#e8eaf0; --muted:#9aa3b5; --accent:#14509e; --gold:#e5b30a; --green:#2ecc71; --blue:#149e46;
}
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--bg);color:var(--txt);font-family:"Segoe UI",Roboto,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}
header{padding:18px 32px 18px;background:linear-gradient(180deg,#11151d 0%,var(--bg) 100%);border-bottom:1px solid var(--line)}
h1{font-size:26px;letter-spacing:.5px;font-weight:700}
h1 span{color:var(--accent)}
footer{color:var(--muted);font-size:12px;padding:24px 32px;border-top:1px solid var(--line);text-align:center}

/* Boutons d'action icone (listes : modifier/supprimer), partages par toutes les pages.
   La couleur reste celle de la classe fonctionnelle (.btn-del / .btn-edit, definies par
   page) : .icon-btn ne fixe que la forme (cadre carre, icone centree). */
.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;padding:0;flex:none}
.icon-btn svg{width:16px;height:16px;fill:currentColor;pointer-events:none}