/* ============================================================
   123Pozicky.eu — admin-login.css
   Page de connexion de l'administration (admin/login.php) uniquement.
   Chargée après theme / public / app : les pages de connexion client
   (app/partials/auth_header.php) ne sont pas concernées.

   Composition : photo d'architecture en plein écran sous un voile vert pin
   traversé d'une lumière dorée, fin filet or, vignette ; au centre exact de
   l'écran (horizontal ET vertical), le logo blanc puis une carte blanche
   cerclée d'or.
   ============================================================ */

.auth-body.adl-body{
  min-height:100vh; min-height:100dvh;
  display:flex; align-items:center; justify-content:center;   /* centré dans les 4 directions */
  /* Même retrait que la connexion client : la valeur vient de --auth-bar-space,
     posée sur .auth-body (app.css). Écrite en dur ici, elle divergeait dès que
     l'autre page était retouchée. */
  padding:var(--auth-bar-space) 16px 32px;
  background:#04241c; position:relative; overflow-x:hidden;
}

/* ------------------------------------------------------------ fond */

.adl-bg{ position:fixed; inset:0; z-index:0; pointer-events:none; }
.adl-bg img{
  width:100%; height:100%; max-width:none; display:block; object-fit:cover;
  filter:grayscale(.3) brightness(.78) blur(1px); transform:scale(1.03);   /* l'échelle masque le bord flou */
}
.adl-bg::after{
  content:""; position:absolute; inset:0;
  background:
    radial-gradient(ellipse at center, transparent 52%, rgba(0,0,0,.5) 100%),
    radial-gradient(820px 560px at 50% 46%, rgba(214,180,94,.36), transparent 66%),
    radial-gradient(700px 480px at 8% 0%, rgba(233,207,134,.22), transparent 70%),
    repeating-linear-gradient(135deg, rgba(214,180,94,.08) 0 1px, transparent 1px 11px),
    linear-gradient(160deg, rgba(7,51,40,.88) 0%, rgba(34,56,34,.66) 44%, rgba(96,70,20,.80) 100%);
}

/* ------------------------------------------------------------ contenu */

.adl-wrap{ position:relative; z-index:1; width:100%; max-width:460px; }

.adl-brand{
  display:flex; align-items:center; justify-content:center; gap:5px; margin-bottom:24px;
  font-family:var(--font-display); font-weight:700; font-size:25px; letter-spacing:-.015em; color:#fff;
}
.adl-brand .logo-mark{
  width:40px; height:40px; border-radius:11px; flex-shrink:0;
  display:inline-flex; align-items:center; justify-content:center;
  /* --surface-deep et non --pine-deep : ce dernier s'inverse en sombre et le
     « 123 » devenait blanc sur une pastille blanche — le défaut même qui avait
     fait figer cette page en clair. Le fond reste blanc en dur, il se pose sur
     le décor photo qui, lui, est sombre dans les deux thèmes. */
  background:#fff; color:var(--surface-deep);
  font-family:var(--font-mono); font-size:15px; font-weight:700; letter-spacing:0;
  box-shadow:0 10px 26px -12px rgba(0,0,0,.6);
}
.adl-brand .logo-word{ color:#fff; }
.adl-brand .admin-tag{ margin-left:8px; font-size:10.5px; padding:3px 7px; }

/* La carte SUIT le thème. Elle était posée en rgba(255,255,255,.97) EN DUR,
   et c'est ce qui obligeait à figer toute la page en clair : son titre emploie
   var(--pine-deep), qui s'inverse en sombre et devenait blanc sur crème.
   En passant par --bg-panel, le fond et le titre basculent ensemble et la
   page peut enfin porter les deux thèmes. Le décor photo, lui, ne change pas :
   il est sombre dans les deux cas, et c'est son parti pris. */
.adl-card{
  position:relative; overflow:hidden;
  background:var(--bg-panel); border-radius:20px;
  padding:38px 36px 32px;
  box-shadow:0 0 0 1px rgba(201,162,75,.5), 0 34px 90px -34px rgba(0,0,0,.75);
}
/* En sombre la carte se détache du décor par sa bordure dorée, l'ombre ne se
   voyant plus sur un fond déjà noir. */
:root[data-theme="dark"] .adl-card{
  box-shadow:0 0 0 1px rgba(201,162,75,.62), 0 34px 90px -34px rgba(0,0,0,.9);
}
/* Les réglages, au-dessus du logo : même largeur que la carte, donc mêmes
   marges de part et d'autre. */
/* HORS du flux centré, comme sur la connexion client : cette page centre son
   contenu dans les quatre directions, la barre restait donc collée au logo.
   Ancrée en haut, elle s'en détache — et garde la gouttière de la carte. */
/* fixed pour la même raison que la barre de la connexion client : .adl-wrap
   porte « position:relative; z-index:1 » (voir plus haut), si bien qu'une barre
   en absolu s'y accrochait et se posait sur la carte au lieu du haut de page.
   z-index relevé à 80 : en fixed, elle sort du contexte d'empilement de
   .adl-wrap et doit rester au-dessus du décor photo. */
.adl-bar{
  position:fixed; top:var(--auth-bar-top); left:16px; right:16px; z-index:80;
  display:flex; align-items:center; justify-content:flex-end;
  width:auto; max-width:460px; margin:0 auto;
}
.adl-bar .theme-switch{ color:rgba(255,255,255,.78); }
.adl-bar .theme-switch-track{ background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.26); }
.adl-bar .theme-switch:hover{ color:#fff; }
/* filet doré en tête de carte */
.adl-card::before{
  content:""; position:absolute; top:0; left:0; right:0; height:3px;
  background:linear-gradient(90deg, rgba(201,162,75,0), var(--gold) 22%, #E9CF86 50%, var(--gold) 78%, rgba(201,162,75,0));
}
.adl-seal{
  width:50px; height:50px; border-radius:14px; margin-bottom:18px;
  display:flex; align-items:center; justify-content:center;
  background:linear-gradient(160deg, #F7EFDC 0%, #E6D19C 100%); color:#7A5A17;
  box-shadow:inset 0 0 0 1px rgba(201,162,75,.55), 0 10px 22px -14px rgba(122,90,23,.7);
}
.adl-seal svg{ width:24px; height:24px; }
.adl-card .auth-title{ font-size:28px; margin-bottom:6px; color:var(--pine-deep); }
.adl-card .auth-sub{ margin-bottom:26px; }
.adl-field{ margin-bottom:18px; }
.adl-card .auth-submit{ margin-top:22px; }
.adl-card input:focus{ border-color:var(--gold); box-shadow:0 0 0 3px rgba(201,162,75,.2); }

.adl-foot{
  display:flex; align-items:center; justify-content:center; gap:8px; flex-wrap:wrap;
  margin:22px 0 0; font-size:12.5px; color:rgba(255,255,255,.72); text-align:center;
}
.adl-foot svg{ width:14px; height:14px; color:var(--gold); flex-shrink:0; }
.adl-foot i{ width:3px; height:3px; border-radius:50%; background:rgba(214,180,94,.8); }

@media (max-width:520px){
  /* Le retrait haut reste celui de la variable : un raccourci « padding » le
     remettait à 24px et la barre, hors du flux, revenait sur le logo. Seules
     les marges latérales et basses se resserrent sur petit écran. */
  .auth-body.adl-body{ padding:var(--auth-bar-space) 14px 24px; }
  .adl-card{ padding:30px 22px 26px; border-radius:18px; }
  .adl-brand{ font-size:22px; margin-bottom:20px; }
  .adl-card .auth-title{ font-size:25px; }
}