/* =========================================================
   DAVBOT PREMIUM — style futuriste moderne (identique à la page de connexion)
   Chargée en DERNIER sur toutes les pages. Le mode blanc garde ses couleurs (html.dav-light).
   Principe : fond bleu nuit, cartes en verre sombre, bordure lumineuse animée sur les cartes
   principales, boutons en dégradé, champs avec halo au focus.
   Les couleurs d'accent suivent la palette choisie dans Paramètres (--dav-c1 / --dav-c2 / --dav-c3).
========================================================= */
@import url("https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&display=swap");

@property --dp-angle{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes dp-spin{to{--dp-angle:360deg}}

/* ---------- Jeu de couleurs unique ---------- */
:root{
  --dp-black:#05070f;
  --dp-s1:#080c18;      /* barres, panneaux */
  --dp-s2:#0b1020;      /* cartes */
  --dp-s3:#0f1630;      /* champs, cartes survolées */
  --dp-s4:#151d3a;      /* boutons secondaires */
  --dp-line:#1c2540;    /* traits fins */
  --dp-line-2:#2a3560;  /* traits au survol */
  --dp-text:#e8ecf8;
  --dp-text-hi:#ffffff;
  --dp-muted:#8791b0;
  --dp-blue:var(--dav-c1,#3de0ff);
  --dp-blue-2:var(--dav-c2,#6fb7ff);
  --dp-violet:var(--dav-c3,#8b6bff);
  --dp-gold:#d4af37;
  --dp-on:#04101a;      /* texte posé sur le dégradé d'accent */
  --dp-grad:linear-gradient(135deg,var(--dav-c1,#3de0ff),var(--dav-c3,#8b6bff));
  --dp-glass:linear-gradient(180deg,rgba(16,22,42,.94),rgba(9,13,26,.94));
  --dp-font:"Space Grotesk",-apple-system,BlinkMacSystemFont,"Segoe UI","Inter",Roboto,Helvetica,Arial,sans-serif;
  --dav-gradient:var(--dp-grad);
  --dav-icon-gradient:var(--dp-grad);
}
/* Le texte sur le dégradé devient clair ou foncé selon la couleur d'accent choisie (lisible avec les 16 palettes) */
@supports (color:oklch(from red l c h)){
  :root{--dp-on:oklch(from var(--dav-c1,#3de0ff) clamp(.06,calc((.7 - l) * 1000),.98) 0 0)}
}

/* ---------- Transition entre pages : sans clignotement blanc ---------- */
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation-duration:.1s}
html{-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%}
html.dav-light{background:#f0f2f5}
html:not(.dav-light){
  overscroll-behavior-y:none;color-scheme:dark;accent-color:var(--dav-c1,#3de0ff);
  background:
    radial-gradient(60rem 40rem at 12% -10%,rgba(var(--dav-accent-rgb,61,224,255),.16),transparent 60%),
    radial-gradient(50rem 36rem at 100% 110%,rgba(139,107,255,.14),transparent 60%),
    #05070f!important;
  background-repeat:no-repeat;background-attachment:fixed;
}
@supports (background:color-mix(in srgb,red 10%,transparent)){
  html:not(.dav-light){
    background:
      radial-gradient(60rem 40rem at 12% -10%,color-mix(in srgb,var(--dav-c3,#8b6bff) 18%,transparent),transparent 60%),
      radial-gradient(50rem 36rem at 100% 110%,color-mix(in srgb,var(--dav-c1,#3de0ff) 14%,transparent),transparent 60%),
      #05070f!important;
    background-repeat:no-repeat;background-attachment:fixed;
  }
}
/* Grille technique discrète, fixe, derrière tout le contenu */
html:not(.dav-light)::before{
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;
  background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);
  background-size:48px 48px;
  -webkit-mask-image:radial-gradient(ellipse at center,#000 30%,transparent 78%);
  mask-image:radial-gradient(ellipse at center,#000 30%,transparent 78%);
}

/* ---------- Typographie uniforme (les deux thèmes) ---------- */
html body,html button,html input,html textarea,html select{font-family:var(--dp-font)}
html body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
h1,h2,h3{letter-spacing:-.02em}

/* ---------- Fond : bleu nuit, le dégradé est porté par <html> ---------- */
html:not(.dav-light) body,
html:not(.dav-light) body.davbot-page:not(.davbot-light){
  background:transparent!important;background-image:none!important;
  --bg:var(--dp-black);--bg2:var(--dp-s1);--dav-bg:var(--dp-black);--dav-bg-2:var(--dp-s1);
  --dav-surface:var(--dp-s2);--dav-surface-2:var(--dp-s3);
  --dav-text:var(--dp-text);--dav-muted:var(--dp-muted);--dav-border:var(--dp-line);
  --panel:var(--dp-s2);--card:var(--dp-s2);--card2:var(--dp-s3);--border:var(--dp-line);
  --muted:var(--dp-muted);--gray:var(--dp-muted);
  --social-bg:var(--dp-black);--social-card:var(--dp-s2);--social-border:var(--dp-line);--social-text:var(--dp-text);--social-muted:var(--dp-muted);
  --s-bg:var(--dp-black);--s-panel:var(--dp-s2);--s-border:var(--dp-line);--s-text:var(--dp-text);--s-muted:var(--dp-muted);
  --fb-surface:var(--dp-s2);--fb-text:var(--dp-text);--fb-muted:var(--dp-muted);--fb-line:var(--dp-line);
  --dst-bg:var(--dp-black);
  color:var(--dp-text);
}
html:not(.dav-light) .profile-hero{--fb-surface:var(--dp-s2)}

/* ---------- Surfaces : cartes en verre sombre (spécificité basse : les variantes de page restent possibles) ---------- */
html:not(.dav-light) :where(.card,.section,.panel,.post,.settings-card,.service-card,.settings,.plan,.product,.info,
  .summary-card,.team-card,.setting,.explorer-item,.dav-global-card,.profile-mini,.sheet,.dsc-sheet,.msgmenu,.kn-card,.kn-item,.comment-item,
  .legal-card,.wallet-card,.login-card){
  background-color:var(--dp-s2);
  background-image:var(--dp-glass);
  border:1px solid var(--dp-line);
  box-shadow:0 18px 44px -28px rgba(0,0,0,.85);
}
html:not(.dav-light) :where(.card,.service-card,.settings-card,.dav-global-card,.plan,.product):hover{
  border-color:rgba(var(--dav-accent-rgb,61,224,255),.38);
  box-shadow:0 0 0 1px rgba(var(--dav-accent-rgb,61,224,255),.10),0 18px 44px -22px rgba(var(--dav-accent-rgb,61,224,255),.32);
  background-color:var(--dp-s3);
}
html:not(.dav-light) .wrap .section{box-shadow:0 18px 44px -28px rgba(0,0,0,.85)!important}

/* ---------- Signature : bordure lumineuse animée (carte de connexion, solde, profil) ---------- */
html:not(.dav-light) :where(.login-card,.wallet-card,.profile-hero){position:relative}
html:not(.dav-light) .login-card{
  border:0!important;
  background-color:var(--dp-s2)!important;background-image:var(--dp-glass)!important;
  box-shadow:0 30px 80px -20px rgba(0,0,0,.7),0 0 60px -20px rgba(var(--dav-accent-rgb,61,224,255),.28)!important;
}
html:not(.dav-light) .login-card::before,
html:not(.dav-light) :is(.wallet-card,.profile-hero)::after{
  content:"";position:absolute;inset:0;top:0;right:0;bottom:0;left:0;width:auto;height:auto;
  padding:1.5px;border-radius:inherit;pointer-events:none;z-index:3;
  background:conic-gradient(from var(--dp-angle),transparent 0deg,var(--dav-c1,#3de0ff) 70deg,var(--dav-c3,#8b6bff) 140deg,transparent 210deg,transparent 360deg);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  animation:dp-spin 6s linear infinite;
}
/* Logo de la carte de connexion : carré en dégradé avec halo */
html:not(.dav-light) .login-logo{
  background:var(--dp-grad)!important;border:0!important;color:var(--dp-on);
  box-shadow:0 0 24px rgba(var(--dav-accent-rgb,61,224,255),.45)!important;
}

/* ---------- Barres du haut et du bas : bleu nuit + fin trait ---------- */
html:not(.dav-light) :where(.topbar,.top-taskbar,.navbar,.social-head,.stage-nav,body>header,.dav-bottom-nav,header.top,.chathead){
  background:rgba(5,7,15,.96)!important;background-image:none!important;
  border-color:var(--dp-line)!important;box-shadow:none!important;
  -webkit-backdrop-filter:none;backdrop-filter:none;
}
html:not(.dav-light) .social-head{border:0!important;border-bottom:1px solid var(--dp-line)!important}
html:not(.dav-light) .social-head .head-links a{background:var(--dp-s4)!important;border:1px solid var(--dp-line)!important}
html:not(.dav-light) .social-head strong,html:not(.dav-light) .social-head strong i{color:var(--dp-text-hi)!important;-webkit-text-fill-color:currentColor!important}
html:not(.dav-light) .dav-bottom-nav,html:not(.dav-light) nav.stage-nav{border-top:1px solid var(--dp-line)!important;border-left:0!important;border-right:0!important;border-bottom:0!important}
html:not(.dav-light) .stage-nav a.active,html:not(.dav-light) .dav-bottom-nav a.active{
  background:transparent!important;color:var(--dp-blue)!important;text-shadow:0 0 14px rgba(var(--dav-accent-rgb,61,224,255),.55);
}

/* ---------- Icônes : monochromes (plus de dégradé néon). L'or reste réservé au VIP et aux badges ---------- */
html:not(.dav-light) body.davbot-page i[class*="fa-"]:not(.fa-crown):not(.fa-circle-check):not(.fa-check):not(.fa-shield-halved):not(.fa-gem):not(.fa-star){
  background:none!important;-webkit-background-clip:border-box!important;background-clip:border-box!important;
  -webkit-text-fill-color:currentColor!important;color:inherit!important;filter:none!important;
}
html:not(.dav-light) body.davbot-page :where(.active,.on,.selected)>i[class*="fa-"]:not(.fa-crown){color:var(--dp-blue)!important}

/* ---------- Boutons principaux : dégradé d'accent, halo doux ---------- */
html:not(.dav-light) body :is(.main-btn,.primary-btn,.btn-primary,.hero-btn,.primary-action,.fb-btn.primary,.social-btn){
  background:var(--dp-grad)!important;color:var(--dp-on)!important;border:0!important;
  font-weight:700;
  box-shadow:0 10px 28px -12px rgba(var(--dav-accent-rgb,61,224,255),.65)!important;
  transition:transform .15s ease,box-shadow .2s ease,filter .2s ease;
}
html:not(.dav-light) body :is(.main-btn,.primary-btn,.btn-primary,.hero-btn,.primary-action,.fb-btn.primary,.social-btn):hover{
  transform:translateY(-1px);filter:brightness(1.06);
  box-shadow:0 14px 34px -12px rgba(var(--dav-accent-rgb,61,224,255),.8)!important;
}
/* Boutons « .btn » classiques (spécificité basse : .ghost, .danger, .secondary, .cancel et .wa gardent leur style) */
html:not(.dav-light) body .btn:where(:not(.secondary):not(.danger):not(.cancel):not(.ghost):not(.wa)){
  background:var(--dp-grad)!important;color:var(--dp-on)!important;border-color:transparent!important;font-weight:700;
}
/* Boutons des listes d'amis : action principale en dégradé */
html:not(.dav-light) body .user-card :is(button,.btn){
  background:var(--dp-grad)!important;color:var(--dp-on)!important;border:0!important;font-weight:700;
}
html:not(.dav-light) .login-card .main-btn{height:50px;border-radius:12px}

/* ---------- Boutons secondaires ---------- */
html:not(.dav-light) :where(.fb-btn,.profile-social-actions .profile-social-btn){
  background:var(--dp-s4)!important;color:var(--dp-text)!important;border:1px solid var(--dp-line)!important;
}
html:not(.dav-light) body .user-card button[data-decline],
html:not(.dav-light) body .user-card button[data-cancel],
html:not(.dav-light) body .user-card button[data-chat]{
  background:var(--dp-s4)!important;color:var(--dp-text)!important;border:1px solid var(--dp-line)!important;box-shadow:none!important;
}
html:not(.dav-light) .composer button,html:not(.dav-light) .composer .tool{color:var(--dp-blue)!important}
button:active,.btn:active,a.fb-btn:active{transform:scale(.985)}

/* ---------- Discussion ---------- */
html:not(.dav-light) .bubble:not(.mine){background:var(--dp-s4)!important;color:var(--dp-text)!important;border:1px solid var(--dp-line)!important}
html:not(.dav-light) .bubble.mine{background:var(--dp-grad)!important;color:var(--dp-on)!important;border:0!important}
html:not(.dav-light) .bubble.mine :is(.time,small,a,.dl){color:inherit!important;opacity:.75}
html:not(.dav-light) .composer input#message{background:var(--dp-s3)!important;border:1px solid var(--dp-line)!important;color:var(--dp-text)!important}
html:not(.dav-light) .wrap input#search{background-color:var(--dp-s3)!important;border:1px solid var(--dp-line)!important}

/* ---------- Puces, onglets, profil ---------- */
html:not(.dav-light) :is(.region-chip.active,.tabs button.on){
  background:var(--dp-grad)!important;color:var(--dp-on)!important;border-color:transparent!important;
}
html:not(.dav-light) .fb-tabs a.on{color:var(--dp-blue);border-bottom-color:var(--dp-blue)}
html:not(.dav-light) .fb-cover:not(.has-img):not(.has-cover){background-image:var(--dp-grad)}
html:not(.dav-light) .ai-card{background-image:linear-gradient(135deg,rgba(var(--dav-accent-rgb,61,224,255),.16),rgba(139,107,255,.14))!important;border:1px solid var(--dp-line)!important}

/* ---------- Pages légales ---------- */
html:not(.dav-light) .legal-card h1{background-image:var(--dp-grad)}
html:not(.dav-light) :is(.legal-top a.back,.legal-card a,.legal-links a:hover,.legal-links a.on,.stat-row strong){color:var(--dp-blue)}
html:not(.dav-light) .stat-row div{background:var(--dp-s3);border-color:var(--dp-line)}

/* ---------- Champs de saisie : fond profond, halo au focus ---------- */
html:not(.dav-light) input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=file]):not([type=color]):not([type=submit]):not([type=button]),
html:not(.dav-light) textarea,html:not(.dav-light) select{
  background-color:rgba(5,7,15,.7);color:var(--dp-text);border-color:var(--dp-line);
  transition:border-color .2s ease,box-shadow .2s ease;
}
html:not(.dav-light) input::placeholder,html:not(.dav-light) textarea::placeholder{color:#505a78;opacity:1}
html:not(.dav-light) option{background:var(--dp-s2);color:var(--dp-text)}
html:not(.dav-light) :is(input:not([type=checkbox]):not([type=radio]):not([type=range]),textarea,select):focus{
  outline:none;border-color:var(--dp-blue)!important;
  box-shadow:0 0 0 4px rgba(var(--dav-accent-rgb,61,224,255),.14),0 0 24px -6px rgba(var(--dav-accent-rgb,61,224,255),.5)!important;
}
html:not(.dav-light) :is(a,button,[tabindex]):focus-visible{outline:2px solid var(--dp-blue);outline-offset:3px}

/* ---------- Texte secondaire et séparateurs ---------- */
html:not(.dav-light) :where(.muted,small,.empty,.sub,.hint){color:var(--dp-muted)}
html:not(.dav-light) hr{border:0;border-top:1px solid var(--dp-line)}

/* ---------- Barres de défilement fines ---------- */
html:not(.dav-light) *{scrollbar-color:var(--dp-line-2) transparent}
html:not(.dav-light) body.davbot-page ::-webkit-scrollbar-thumb{background:var(--dp-line-2)}
::selection{background:rgba(var(--dav-accent-rgb,61,224,255),.35);color:#fff}

/* ---------- Mode blanc : seul le texte posé sur l'accent est adapté (cyan clair ≠ texte blanc) ---------- */
@supports (color:oklch(from red l c h)){
  html.dav-light body .btn:not(.ghost):not(.danger):not(.wa),
  html.dav-light body .social-btn,
  html.dav-light body .region-chip.active,
  html.dav-light body .bubble.mine{color:var(--dp-on)!important}
  html.dav-light body .bubble.mine :is(.time,a,.dl){color:inherit!important}
}

/* ---------- Écrans gardés (affichage instantané) : apparition immédiate, sans effet ---------- */
html.dav-instant :where(#feedList,#stories,#messages,#usersList,#friends,#requests,#conversationList,#notificationList){animation:none!important}

/* ---------- Mouvement réduit ---------- */
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  ::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}
}
