/* DeepChat — tema Deepelse sopra LibreChat.
 *
 * Caricato da nginx dopo il CSS di LibreChat (sub_filter su </head>), quindi vince sul cascade.
 * Le variabili hanno !important perché il ThemeProvider di LibreChat ne scrive alcune
 * inline su <html>, e una dichiarazione !important batte lo stile inline non importante.
 *
 * Regole del brand (deepelse-design/README.md):
 *   palette di cinque valori: black #000000, dust #fbf7ea, green #cff200, blue #0000fe, brown #9b694d
 *   grigi = nero in trasparenza su dust (qui appiattiti in triplette RGB, perché LibreChat
 *   compone i colori come rgb(var(--x) / alpha));
 *   raggio 0, pill solo su bottoni, badge e switch; nessuna ombra tranne i modali;
 *   RM Neue per tutto, tracking 0; errori in brown, conferme in green, focus in blue.
 */

@font-face{font-family:"RM Neue";src:url("/deepchat/fonts/rmneue-regular.woff") format("woff");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"RM Neue";src:url("/deepchat/fonts/rmneue-italic.woff") format("woff");font-weight:400;font-style:italic;font-display:swap}
@font-face{font-family:"RM Neue";src:url("/deepchat/fonts/rmneue-semibold.woff") format("woff");font-weight:500 600;font-style:normal;font-display:swap}
@font-face{font-family:"RM Neue";src:url("/deepchat/fonts/rmneue-semibolditalic.woff") format("woff");font-weight:500 600;font-style:italic;font-display:swap}
@font-face{font-family:"RM Neue";src:url("/deepchat/fonts/rmneue-bold.woff") format("woff");font-weight:700 900;font-style:normal;font-display:swap}
@font-face{font-family:"Orbikular";src:url("/deepchat/fonts/orbikular-semibold.woff") format("woff");font-weight:600;font-style:normal;font-display:swap}

/* ---------- Tema chiaro: dust come fondo, nero come inchiostro ---------- */
:root,
html{
  --dp-black:#000000;
  --dp-dust:#fbf7ea;
  --dp-green:#cff200;
  --dp-blue:#0000fe;
  --dp-brown:#9b694d;
  --dp-ease:cubic-bezier(.2,0,0,1);

  --white:251 247 234 !important;           /* dust: niente bianco puro */
  --black:0 0 0 !important;

  /* Nero su dust a opacità crescente (2% … 96%), appiattito */
  --gray-20:246 242 229 !important;
  --gray-50:241 237 225 !important;
  --gray-100:231 227 215 !important;
  --gray-200:221 217 206 !important;
  --gray-300:191 188 178 !important;
  --gray-400:151 148 140 !important;
  --gray-500:100 99 94 !important;
  --gray-600:75 74 70 !important;
  --gray-650:60 59 56 !important;
  --gray-700:45 44 42 !important;
  --gray-800:25 25 23 !important;
  --gray-850:15 15 14 !important;
  --gray-875:10 10 9 !important;
  --gray-900:0 0 0 !important;
  --gizmo-gray-500:100 99 94 !important;
  --gizmo-gray-600:75 74 70 !important;
  --gizmo-gray-950:0 0 0 !important;

  /* Conferme: green come fondo, nero come testo (green non va mai come testo su dust) */
  --green-50:207 242 0 !important;
  --green-100:207 242 0 !important;
  --green-200:207 242 0 !important;
  --green-300:207 242 0 !important;
  --green-400:0 0 0 !important;
  --green-500:0 0 0 !important;
  --green-600:0 0 0 !important;
  --green-700:0 0 0 !important;
  --green-800:0 0 0 !important;
  --green-900:0 0 0 !important;
  --green-950:0 0 0 !important;

  /* Errori e avvisi: brown. Le tinte chiare sono brown al 12% e 24% su dust */
  --red-50:239 230 215 !important;
  --red-100:239 230 215 !important;
  --red-200:228 213 196 !important;
  --red-300:155 105 77 !important;
  --red-400:155 105 77 !important;
  --red-500:155 105 77 !important;
  --red-600:155 105 77 !important;
  --red-700:155 105 77 !important;
  --red-800:124 84 62 !important;
  --red-900:124 84 62 !important;
  --red-950:124 84 62 !important;
  --amber-50:239 230 215 !important;
  --amber-100:239 230 215 !important;
  --amber-200:228 213 196 !important;
  --amber-300:155 105 77 !important;
  --amber-400:155 105 77 !important;
  --amber-500:155 105 77 !important;
  --amber-600:155 105 77 !important;
  --amber-700:155 105 77 !important;
  --amber-800:124 84 62 !important;
  --amber-900:124 84 62 !important;
  --amber-950:124 84 62 !important;

  /* Informazioni e link: blue */
  --blue-50:221 217 206 !important;
  --blue-100:221 217 206 !important;
  --blue-200:191 188 178 !important;
  --blue-300:0 0 254 !important;
  --blue-400:0 0 254 !important;
  --blue-500:0 0 254 !important;
  --blue-600:0 0 254 !important;
  --blue-700:0 0 254 !important;
  --blue-800:0 0 254 !important;
  --blue-900:0 0 254 !important;
  --blue-950:0 0 254 !important;
  --brand-purple:0 0 254 !important;

  /* Superfici */
  --presentation:var(--white) !important;
  --surface-primary:var(--white) !important;
  --surface-primary-alt:var(--gray-50) !important;
  --surface-primary-contrast:var(--gray-100) !important;
  --surface-secondary:var(--gray-50) !important;
  --surface-secondary-alt:var(--gray-100) !important;
  --surface-tertiary:var(--gray-100) !important;
  --surface-tertiary-alt:var(--white) !important;
  --surface-dialog:var(--white) !important;
  --surface-chat:var(--white) !important;
  --surface-hover:var(--gray-100) !important;
  --surface-hover-alt:var(--gray-200) !important;
  --surface-active:var(--gray-100) !important;
  --surface-active-alt:var(--gray-200) !important;
  --surface-composer-hover:var(--gray-100) !important;
  --surface-submit:207 242 0 !important;
  --surface-submit-hover:0 0 254 !important;
  --surface-destructive:155 105 77 !important;
  --surface-destructive-hover:124 84 62 !important;
  --surface-inverted:0 0 0 !important;
  --surface-inverted-hover:0 0 254 !important;
  --text-inverted:251 247 234 !important;
  --header-primary:var(--white) !important;
  --header-hover:var(--gray-50) !important;
  --header-button-hover:var(--gray-100) !important;

  /* Testo */
  --text-primary:0 0 0 !important;
  --text-secondary:75 74 70 !important;
  --text-secondary-alt:100 99 94 !important;
  --text-tertiary:100 99 94 !important;
  --text-muted:100 99 94 !important;
  --text-warning:155 105 77 !important;
  --text-destructive:155 105 77 !important;
  --text-on-status:0 0 0 !important;
  --ring-primary:0 0 254 !important;

  /* Linee: hairline al 12% */
  --border-light:var(--gray-200) !important;
  --border-medium:var(--gray-200) !important;
  --border-medium-alt:var(--gray-300) !important;
  --border-heavy:var(--gray-300) !important;
  --border-xheavy:0 0 0 !important;
  --border-destructive:155 105 77 !important;

  /* Stati */
  --status-success:0 0 0 !important;
  --status-success-subtle:207 242 0 !important;
  --status-success-border:0 0 0 !important;
  --status-success-strong:0 0 0 !important;
  --status-info:0 0 254 !important;
  --status-info-subtle:var(--gray-50) !important;
  --status-info-border:0 0 254 !important;
  --status-info-strong:0 0 254 !important;
  --status-warning:155 105 77 !important;
  --status-warning-subtle:239 230 215 !important;
  --status-warning-border:155 105 77 !important;
  --status-warning-strong:155 105 77 !important;
  --status-error:155 105 77 !important;
  --status-error-subtle:239 230 215 !important;
  --status-error-border:155 105 77 !important;
  --status-error-strong:155 105 77 !important;
  --status-verified:0 0 254 !important;

  /* Serie dei grafici: solo colori di palette */
  --series-1:0 0 0 !important;
  --series-2:0 0 254 !important;
  --series-3:155 105 77 !important;
  --series-4:100 99 94 !important;
  --series-5:0 0 0 !important;
  --series-6:0 0 254 !important;
  --series-7:155 105 77 !important;
  --series-8:100 99 94 !important;

  /* Sintassi del codice: inchiostro, blue e brown */
  --syntax-text:0 0 0 !important;
  --syntax-comment:100 99 94 !important;
  --syntax-meta:75 74 70 !important;
  --syntax-builtin:155 105 77 !important;
  --syntax-keyword:0 0 254 !important;
  --syntax-string:155 105 77 !important;
  --syntax-attr:0 0 254 !important;
  --syntax-title:0 0 0 !important;

  --switch-unchecked:151 148 140 !important;

  /* Link e accenti: inchiostro, hover blue */
  --accent-primary:0 0 0 !important;
  --accent-primary-hover:0 0 254 !important;
  --link-visited:0 0 254 !important;
  --shimmer-dip:191 188 178 !important;
  --surface-overlay:0 0 0 !important;
  --chart-widget-surface:251 247 234 !important;
  --chart-widget-stroke:221 217 206 !important;
  --text-fixed:0 0 0 !important;
  --surface-fixed:251 247 234 !important;
  --tw-ring-color:#0000fe;
  --tw-ring-offset-color:#fbf7ea;

  /* Icone dei provider: niente colori di terzi, blocco nero con segno dust */
  --provider-openai:#000000 !important;
  --provider-openai-gpt4:#000000 !important;
  --provider-openai-reasoning:#000000 !important;
  --provider-anthropic:#000000 !important;
  --provider-azure:#000000 !important;
  --provider-bedrock:#000000 !important;
  --provider-foreground:#fbf7ea !important;

  /* Forma, tipografia, movimento */
  --radius:0px !important;
  --theme-control-radius:0px !important;
  --theme-round-control-radius:9999px !important;
  --theme-surface-radius:0px !important;
  --theme-large-surface-radius:0px !important;
  --theme-font-family:"RM Neue",ui-sans-serif,system-ui,sans-serif !important;
  --theme-elevation-surface:none !important;
  --theme-motion-fast:140ms !important;
  --theme-motion-normal:240ms !important;
}

/* ---------- Tema scuro: nero come fondo, dust come inchiostro (dp-invert) ---------- */
html.dark,
.dark{
  --white:251 247 234 !important;
  --gray-20:231 227 215 !important;
  --gray-50:231 227 215 !important;
  --gray-100:221 217 206 !important;
  --gray-200:191 188 178 !important;
  --gray-300:151 148 140 !important;
  --gray-400:151 148 140 !important;
  --gray-500:100 99 94 !important;
  --gray-600:60 59 56 !important;
  --gray-650:45 44 42 !important;
  --gray-700:30 30 28 !important;
  --gray-800:15 15 14 !important;
  --gray-850:10 10 9 !important;
  --gray-875:5 5 5 !important;
  --gray-900:0 0 0 !important;

  /* Su nero il green può essere testo */
  --green-50:207 242 0 !important;
  --green-100:207 242 0 !important;
  --green-200:207 242 0 !important;
  --green-300:207 242 0 !important;
  --green-400:207 242 0 !important;
  --green-500:207 242 0 !important;
  --green-600:207 242 0 !important;
  --green-700:207 242 0 !important;
  --green-800:207 242 0 !important;
  --green-900:207 242 0 !important;
  --green-950:207 242 0 !important;

  --presentation:0 0 0 !important;
  --surface-primary:0 0 0 !important;
  --surface-primary-alt:10 10 9 !important;
  --surface-primary-contrast:15 15 14 !important;
  --surface-secondary:10 10 9 !important;
  --surface-secondary-alt:15 15 14 !important;
  --surface-tertiary:30 30 28 !important;
  --surface-tertiary-alt:30 30 28 !important;
  --surface-dialog:10 10 9 !important;
  --surface-chat:15 15 14 !important;
  --surface-hover:30 30 28 !important;
  --surface-hover-alt:45 44 42 !important;
  --surface-active:45 44 42 !important;
  --surface-active-alt:30 30 28 !important;
  --surface-composer-hover:30 30 28 !important;
  --surface-submit:207 242 0 !important;
  --surface-submit-hover:251 247 234 !important;
  --surface-inverted:251 247 234 !important;
  --surface-inverted-hover:207 242 0 !important;
  --text-inverted:0 0 0 !important;
  --header-primary:0 0 0 !important;
  --header-hover:15 15 14 !important;
  --header-button-hover:30 30 28 !important;

  --text-primary:251 247 234 !important;
  --text-secondary:191 188 178 !important;
  --text-secondary-alt:151 148 140 !important;
  --text-tertiary:151 148 140 !important;
  --text-muted:151 148 140 !important;
  --text-on-status:0 0 0 !important;
  --ring-primary:207 242 0 !important;

  --border-light:45 44 42 !important;
  --border-medium:45 44 42 !important;
  --border-medium-alt:60 59 56 !important;
  --border-heavy:60 59 56 !important;
  --border-xheavy:251 247 234 !important;

  --status-success:207 242 0 !important;
  --status-success-subtle:15 15 14 !important;
  --status-success-border:207 242 0 !important;
  --status-info:251 247 234 !important;
  --status-info-subtle:15 15 14 !important;
  --status-info-border:251 247 234 !important;
  --status-warning-subtle:15 15 14 !important;
  --status-error-subtle:15 15 14 !important;

  --syntax-text:251 247 234 !important;
  --syntax-comment:151 148 140 !important;
  --syntax-meta:191 188 178 !important;
  --syntax-builtin:207 242 0 !important;
  --syntax-keyword:207 242 0 !important;
  --syntax-string:251 247 234 !important;
  --syntax-attr:207 242 0 !important;
  --syntax-title:251 247 234 !important;

  --switch-unchecked:100 99 94 !important;

  --accent-primary:251 247 234 !important;
  --accent-primary-hover:207 242 0 !important;
  --link-visited:207 242 0 !important;
  --shimmer-dip:60 59 56 !important;
  --chart-widget-surface:10 10 9 !important;
  --chart-widget-stroke:45 44 42 !important;
  --surface-fixed:251 247 234 !important;
  --text-fixed:0 0 0 !important;
  --tw-ring-color:#cff200;
  --tw-ring-offset-color:#000000;
  --provider-openai:#fbf7ea !important;
  --provider-openai-gpt4:#fbf7ea !important;
  --provider-openai-reasoning:#fbf7ea !important;
  --provider-anthropic:#fbf7ea !important;
  --provider-azure:#fbf7ea !important;
  --provider-bedrock:#fbf7ea !important;
  --provider-foreground:#000000 !important;
}

/* ---------- Tipografia ---------- */
html,body,#root,
button,input,select,textarea,
.font-sans{
  font-family:"RM Neue",ui-sans-serif,system-ui,sans-serif !important;
  letter-spacing:0 !important;
}
*{letter-spacing:0 !important}
code,pre,kbd,samp,.font-mono,.hljs,.cm-editor,.cm-content{
  font-family:"Roboto Mono",ui-monospace,SFMono-Regular,Menlo,monospace !important;
}
h1,h2,h3,.font-semibold,.font-medium{font-weight:600}
::selection{background:var(--dp-green);color:var(--dp-black)}

/* ---------- Forma: raggio 0, pill solo sui controlli ---------- */
[class*="rounded"],
img,video,input,textarea,select,pre,code,table,
[role="dialog"],[role="menu"],[role="listbox"],[role="tooltip"],[data-radix-popper-content-wrapper] > *{
  border-radius:0 !important;
}
button.rounded-full,[role="button"].rounded-full,
[role="switch"],[role="switch"] > span,
.rounded-full[class*="badge"],
button[class*="rounded"]:not([role="menuitem"]):not([role="tab"]):not([role="option"]):not(:has(> img)){
  border-radius:9999px !important;
}
/* Avatar e indicatori tondi restano quadrati: il brand non ha cerchi */
.rounded-full:not(button):not([role="switch"]):not([role="switch"] > span){border-radius:0 !important}

/* ---------- Niente ombre, tranne i modali ---------- */
[class*="shadow"],[class*="drop-shadow"]{box-shadow:none !important;filter:none}
[role="dialog"],[role="alertdialog"]{box-shadow:0 24px 64px rgba(0,0,0,.18) !important}

/* ---------- Focus: due anelli, fondo e blue ---------- */
:focus-visible{
  outline:none !important;
  box-shadow:0 0 0 2px var(--dp-dust),0 0 0 4px var(--dp-blue) !important;
}
.dark :focus-visible{box-shadow:0 0 0 2px var(--dp-black),0 0 0 4px var(--dp-green) !important}

/* ---------- Bottone principale: green con testo nero, hover blue ---------- */
.bg-surface-submit,
.bg-surface-submit *{color:var(--dp-black) !important}
.bg-surface-submit:hover,
.hover\:bg-surface-submit-hover:hover,
.hover\:bg-surface-submit-hover:hover *{color:var(--dp-dust) !important}
.dark .bg-surface-submit:hover,
.dark .hover\:bg-surface-submit-hover:hover *{color:var(--dp-black) !important}
/* Invio messaggio: nero, hover blue (il green resta per l'unico elemento accento della vista) */
[data-testid="send-button"]{
  background:var(--dp-black) !important;color:var(--dp-dust) !important;border-radius:9999px !important;
}
[data-testid="send-button"]:hover:not(:disabled){background:var(--dp-blue) !important}
.dark [data-testid="send-button"]{background:var(--dp-green) !important;color:var(--dp-black) !important}
.dark [data-testid="send-button"]:hover:not(:disabled){background:var(--dp-dust) !important}
button:disabled,[aria-disabled="true"]{opacity:.32 !important;cursor:not-allowed !important}

/* Distruttivo: brown con testo dust */
.bg-surface-destructive,.bg-surface-destructive *{color:var(--dp-dust) !important}

/* Press: solo scala, mai colore */
button:active:not(:disabled){transform:scale(.985)}

/* ---------- Link ---------- */
a{transition:color 140ms var(--dp-ease)}
.markdown a,.prose a{color:inherit;text-decoration:underline;text-underline-offset:2px}
.markdown a:hover,.prose a:hover,a:hover{color:var(--dp-blue)}
.dark .markdown a:hover,.dark .prose a:hover,.dark a:hover{color:var(--dp-green)}

/* ---------- Composer: rettangolo con hairline nera ---------- */
form [class*="rounded-t-"],form [class*="rounded-3xl"],form [class*="rounded-2xl"]{
  border-radius:0 !important;
}

/* ---------- Schermata di caricamento ---------- */
#loading-container{background-color:var(--dp-dust) !important}
html.dark #loading-container{background-color:var(--dp-black) !important}

/* ---------- Logo: versione dust o green su fondo nero (file già colorati, nessun filtro) ---------- */
html.dark img[src$="assets/logo.svg"]{content:url("/deepchat/logomark-green.svg")}

/* ---------- Movimento misurato ---------- */
*,*::before,*::after{transition-timing-function:var(--dp-ease)}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{transition-duration:0ms !important;animation-duration:0ms !important}
}

/* ---------- Menu e popover: piatti, hairline invece dell'ombra ---------- */
.popover-ui,[data-radix-popper-content-wrapper] > *,[role="menu"],[role="listbox"]{
  box-shadow:none !important;
  border:1px solid rgb(var(--border-light)) !important;
}

/* ---------- Avatar con iniziali generato da LibreChat: colori casuali fuori palette ----------
   Si sostituisce con un blocco nero e segno dust. Le foto caricate dagli utenti restano. */
img[src^="data:image/svg+xml"][alt$="avatar"],
img[src^="data:image/svg+xml"][alt$="avatar" i]{
  content:url("/deepchat/avatar.svg");
}

/* ---------- Campi dei form di accesso: LibreChat li colora con un'ombra interna bianca o #0d0d0d ---------- */
.webkit-dark-styles,.webkit-dark-styles:focus{
  -webkit-box-shadow:0 0 0 50vh var(--dp-dust) inset !important;
  box-shadow:0 0 0 50vh var(--dp-dust) inset !important;
  -webkit-text-fill-color:var(--dp-black) !important;
}
.dark .webkit-dark-styles,.dark .webkit-dark-styles:focus{
  -webkit-box-shadow:0 0 0 50vh var(--dp-black) inset !important;
  box-shadow:0 0 0 50vh var(--dp-black) inset !important;
  -webkit-text-fill-color:var(--dp-dust) !important;
}
.webkit-dark-styles:focus-visible{
  box-shadow:0 0 0 50vh var(--dp-dust) inset,0 0 0 2px var(--dp-dust),0 0 0 4px var(--dp-blue) !important;
}
.dark .webkit-dark-styles:focus-visible{
  box-shadow:0 0 0 50vh var(--dp-black) inset,0 0 0 2px var(--dp-black),0 0 0 4px var(--dp-green) !important;
}

/* ---------- Immagini nei messaggi: LibreChat le avvolge in un pulsante (per l'anteprima).
   La regola delle pill vale per i bottoni di comando, non per le immagini: spigolo vivo. ---------- */
.image-attachment-container button,
.image-attachment-container button img,
button:has(> img.object-contain),
button:has(> img.object-cover){
  border-radius:0 !important;
}
