/* Ajouts propres à la version serveur : connexion, barre utilisateur,
   messages flash, écrans d'administration. La charte (variables, thème
   clair/sombre, composants du tableau de bord) vient de rhea.css. */

/* ---------- Barre du haut ---------- */
.user-zone { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
.user-name { font-family:var(--mono); font-size:12px; color:var(--text); display:flex; align-items:center; gap:7px; }
.user-role { font-size:10px; text-transform:uppercase; letter-spacing:0.5px; color:var(--accent);
             border:1px solid var(--border); border-radius:10px; padding:1px 7px; }
.inline-form { display:inline; }
.btn-link { background:transparent; }
.btn-primary { background:var(--accent); border-color:var(--accent); color:#fff; font-weight:600; }
.btn-primary:hover { filter:brightness(1.08); }
.btn-danger { color:var(--red); border-color:rgba(242,92,92,0.35); }
.btn-danger:hover { background:rgba(242,92,92,0.12); border-color:var(--red); }

/* Bouton Actualiser : relit le XML sur le serveur, tous rôles confondus. */
.btn-reload { display:inline-flex; align-items:center; gap:6px; white-space:nowrap; }
.reload-ico { display:inline-block; font-size:14px; line-height:1; }
.btn-reload.is-busy { opacity:0.65; cursor:progress; }
.btn-reload.is-busy .reload-ico { animation:reload-spin 0.9s linear infinite; }
.btn-reload.is-done { border-color:var(--green); color:var(--green); }
@keyframes reload-spin { to { transform:rotate(360deg); } }
@media (prefers-reduced-motion:reduce) { .btn-reload.is-busy .reload-ico { animation:none; } }
/* Sur petit écran, l'icône suffit : le libellé mangerait toute la barre. */
@media (max-width:640px) { .btn-reload { font-size:0; gap:0; padding:6px 9px; }
                           .btn-reload .reload-ico { font-size:15px; } }

/* ---------- Messages flash ---------- */
.flash-zone { padding:12px 28px 0; display:flex; flex-direction:column; gap:8px; max-width:1700px; margin:0 auto; }
.flash { border:1px solid var(--border); border-left-width:3px; border-radius:6px; padding:10px 14px;
         font-size:13px; background:var(--panel); }
.flash-success { border-left-color:var(--green); }
.flash-danger  { border-left-color:var(--red); }
.flash-warning { border-left-color:var(--amber); }
@media (max-width:640px) { .flash-zone { padding:10px 14px 0; } }

/* ---------- Connexion ---------- */
/* Sur les pages non authentifiées (login, erreur), on retire la barre du haut :
   l'écran d'entrée doit être aussi dépouillé que possible, pas de logo, pas
   d'aparté « accès réservé » — juste le formulaire. */
body.auth-mode .topbar { display:none; }
body.auth-mode .flash-zone { padding-top:24px; }
.auth-wrap { display:flex; align-items:center; justify-content:center; min-height:88vh; padding:30px 16px; }
.auth-card { background:var(--panel); border:1px solid var(--border); border-radius:12px;
             padding:28px 30px; width:100%; max-width:380px; display:flex; flex-direction:column; gap:10px; }
.auth-card h1 { font-size:20px; font-weight:600; }
.auth-sub { font-size:12.5px; color:var(--text-dim); margin-bottom:10px; line-height:1.5; }
.auth-card label { font-size:11px; text-transform:uppercase; letter-spacing:0.4px; color:var(--text-faint); }
.auth-card input { background:var(--bg); border:1px solid var(--border); color:var(--text);
                   border-radius:6px; padding:10px 12px; font-size:14px; font-family:var(--sans); width:100%; }
.auth-card input:focus { outline:none; border-color:var(--accent); }
.auth-card .btn { margin-top:14px; padding:11px; font-size:14px; text-align:center; }

/* ---------- Écran de chargement du tableau de bord ---------- */
#loader-screen { display:flex; flex-direction:column; align-items:center; justify-content:center;
                 min-height:60vh; text-align:center; padding:40px 20px; }
#loader-box { border:1px solid var(--border); border-radius:12px; padding:40px 48px; max-width:620px; background:var(--panel); }
#loader-box h2 { font-size:18px; margin-bottom:10px; font-weight:600; }
#loader-box p { color:var(--text-dim); font-size:13px; margin-bottom:6px; }
#loader-box .hint { color:var(--text-faint); font-size:12px; margin-top:16px; }

/* ---------- Administration ---------- */
.admin-wrap { max-width:1400px; margin:0 auto; padding:24px 28px 60px; display:flex; flex-direction:column; gap:16px; }
.admin-wrap h1 { font-size:20px; font-weight:600; }
.admin-sub { font-size:12.5px; color:var(--text-dim); line-height:1.5; }
.admin-form { display:flex; flex-wrap:wrap; gap:14px; align-items:flex-end; padding-top:12px; }
.admin-field label { display:flex; flex-direction:column; gap:5px; font-size:11px;
                     text-transform:uppercase; letter-spacing:0.4px; color:var(--text-faint); }
.admin-form input, .admin-form select, .admin-table input, .admin-table select {
  background:var(--bg); border:1px solid var(--border); color:var(--text);
  border-radius:5px; padding:7px 10px; font-size:13px; font-family:var(--sans); }
.admin-form input:focus, .admin-table input:focus { outline:none; border-color:var(--accent); }
.hidden-form { display:none; }
.admin-table { width:100%; font-size:12.5px; }
.admin-table thead th { text-align:left; }
.admin-table tbody td { text-align:left; font-family:var(--sans); padding:8px 10px; vertical-align:middle; }
.admin-table tbody td.mono { font-family:var(--mono); color:var(--text-dim); }
.admin-table tbody td.center { text-align:center; }
.admin-name { font-weight:600; }
.admin-actions { display:flex; gap:8px; white-space:nowrap; }
.admin-empty { color:var(--text-faint); font-style:italic; text-align:center; padding:20px; }
.admin-meta { max-width:320px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:11px; }
.tag-action { font-family:var(--mono); font-size:10.5px; padding:2px 8px; border-radius:10px;
              border:1px solid var(--border); color:var(--text-dim); }
.tag-action.tag-ko { color:var(--red); border-color:rgba(242,92,92,0.35); }
@media (max-width:640px) { .admin-wrap { padding:16px 14px 60px; } }

/* ---------- Paramètres : source de données ---------- */
.set-meta { font-family:var(--mono); font-size:12px; color:var(--text-dim); white-space:nowrap; }
.upload-zone { display:flex; align-items:center; gap:8px; }
#upload-status { margin-top:6px; }
#upload-status.ok { color:var(--green); }
#upload-status.ko { color:var(--red); }

/* ---------- Écran de saisie ---------- */
.admin-wrap-large { max-width:1500px; }
.saisie-onglets { display:flex; gap:2px; margin:18px 0 16px; border-bottom:1px solid var(--border); flex-wrap:wrap; }
.saisie-onglet { background:transparent; border:none; border-bottom:2px solid transparent; color:var(--text-dim);
                 padding:10px 16px; font-size:13px; font-weight:500; cursor:pointer; font-family:var(--sans); }
.saisie-onglet:hover { color:var(--text); }
.saisie-onglet.active { color:var(--text); border-bottom-color:var(--accent); }
.saisie-onglet .pastille { display:inline-block; margin-left:6px; font-size:10px; font-family:var(--mono);
                           background:var(--panel-light); border:1px solid var(--border); border-radius:9px; padding:0 6px; }
.saisie-panneau { display:none; }
.saisie-panneau.active { display:block; }

.saisie-form { padding-top:12px; display:flex; flex-direction:column; gap:16px; }
.saisie-grille { display:grid; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); gap:14px; }
.saisie-form label { display:flex; flex-direction:column; gap:5px; font-size:11px; text-transform:uppercase;
                     letter-spacing:0.4px; color:var(--text-dim); }
.saisie-form input, .saisie-form select {
  background:var(--panel); border:1px solid var(--border); color:var(--text); border-radius:5px;
  padding:8px 10px; font-size:13px; font-family:var(--sans); text-transform:none; letter-spacing:0; }
.saisie-form input:focus, .saisie-form select:focus { outline:none; border-color:var(--accent); }
.saisie-form input[readonly] { background:var(--panel-light); color:var(--text-dim); cursor:default; }
.saisie-form .aide { font-size:11px; text-transform:none; letter-spacing:0; color:var(--text-dim); min-height:14px; }
.saisie-large { width:100%; }

/* Ligne de calcul, calquée sur la boîte de dialogue de Portfolio Performance */
.saisie-calcul { display:flex; align-items:flex-end; gap:10px; flex-wrap:wrap;
                 background:var(--panel-light); border:1px solid var(--border); border-radius:8px; padding:14px; }
.saisie-calcul label { flex:1 1 130px; justify-content:flex-end; }
/* Tous les labels de cette ligne réservent l'espace de la ligne d'aide sous
   l'input : sans ça, seul le label « Cotation » (qui a une vraie aide) prenait
   la hauteur totale et son voisin PARTS se retrouvait décalé vers le haut. */
.saisie-calcul label::after { content:''; display:block; min-height:14px; }
.saisie-calcul label:has(.aide)::after { display:none; }
.saisie-op { font-family:var(--mono); font-size:15px; color:var(--text-dim); padding-bottom:23px; }
.saisie-total { font-weight:600; }
.mode-dividende .tx-parts { display:none; }

.saisie-retour { font-size:12.5px; line-height:1.5; min-height:18px; }
.saisie-retour.ok { color:var(--green); }
.saisie-retour.alerte { color:var(--amber); }
.saisie-retour.ko { color:var(--red); }
.saisie-actions { display:flex; gap:10px; }

.admin-table td.right, .admin-table th.right { text-align:right; }
.ligne-annulee { opacity:0.5; }
.ligne-annulee .admin-name { text-decoration:line-through; }

@media (max-width:640px) {
  .saisie-calcul { flex-direction:column; align-items:stretch; }
  .saisie-op { display:none; }
}
