/* SW tools -- Kleid fuer BentoPDF (AGPL-3.0).
   Aenderungsschicht nach AGPL-3.0 Abschnitt 5 und 13: diese Datei aendert
   das Aussehen, nicht den Code (README.md in diesem Ordner).

   BentoPDF baut mit Tailwind v4: Farben und Schrift stehen als
   Theme-Variablen (--color-gray-*, --color-indigo-*, --font-sans) in
   @layer theme. Eine Deklaration ausserhalb jeder Ebene gewinnt gegen jede
   Ebene; !important nur zur Sicherheit gegen eigene :root-Regeln. So
   folgen alle Utility-Klassen (bg-gray-800, text-indigo-400, ...) dem Kleid,
   ohne dass jede Klasse einzeln ueberschrieben wird.

   Zuordnung:
   - Grau = Flaechen und Text der SW-labs-Palette.
   - Indigo hell (300/400, Symbole, Links) = neutraler Text; Amber nur an
     der Handlung, also Indigo 500/600/700 (Primaerknoepfe, aktive
     Auswahl, Fokus). */

:root {
  --font-sans: var(--swk-font) !important;
  --default-font-family: var(--swk-font) !important;

  --color-gray-50: #f7f7f8 !important;
  --color-gray-100: var(--swk-text) !important;
  --color-gray-200: #e2e2e6 !important;
  --color-gray-300: #d4d4d9 !important;
  --color-gray-400: var(--swk-text-muted) !important;
  --color-gray-500: var(--swk-text-faint) !important;
  --color-gray-600: #33333b !important;
  --color-gray-700: var(--swk-border) !important;
  --color-gray-800: var(--swk-card) !important;
  --color-gray-900: var(--swk-bg) !important;
  --color-gray-950: #0c0c0e !important;

  --color-indigo-50: #fff8eb !important;
  --color-indigo-100: #fdeccb !important;
  --color-indigo-200: #d4d4d9 !important;
  --color-indigo-300: var(--swk-text) !important;
  --color-indigo-400: var(--swk-text-muted) !important;
  --color-indigo-500: var(--swk-accent) !important;
  --color-indigo-600: var(--swk-btn-primary-flat) !important;
  --color-indigo-700: #d98806 !important;
  --color-indigo-800: #3a2a0c !important;
  --color-indigo-900: #2b2010 !important;
  --color-indigo-950: #1d160b !important;

  color-scheme: dark;
}

body {
  font-family: var(--swk-font) !important;
  background-color: var(--swk-bg) !important;
}

h1,
h2,
h3,
.category-header,
#tools-header h1 {
  font-family: var(--swk-font-display) !important;
  letter-spacing: -0.005em;
}

/* Primaerknoepfe: Amber-Flaeche verlangt dunkle Schrift (Kontrast). */
.bg-indigo-500,
.bg-indigo-600,
.bg-indigo-700,
.bg-indigo-500 .text-white,
.bg-indigo-600 .text-white,
.bg-indigo-600.text-white,
.bg-indigo-700.text-white {
  color: var(--swk-btn-primary-text) !important;
}
.btn-gradient,
button.btn-gradient {
  background: var(--swk-btn-primary-bg) !important;
  color: var(--swk-btn-primary-text) !important;
  border: 1px solid var(--swk-btn-primary-border) !important;
  border-radius: var(--swk-radius-md) !important;
  box-shadow: var(--swk-btn-primary-shadow) !important;
  font-weight: 600;
}
.btn-gradient:hover:not(:disabled) {
  background: var(--swk-btn-primary-bg-hover) !important;
}
.btn-gradient:disabled {
  opacity: 0.5;
}

/* Werkzeugkacheln */
.tool-card {
  border: 1px solid var(--swk-border);
  border-radius: var(--swk-radius-xl) !important;
}
.tool-card:hover {
  background-color: var(--swk-card-hover) !important;
  border-color: var(--swk-btn-secondary-border-hover);
}

/* Fokus sichtbar in Amber */
input:focus,
select:focus,
textarea:focus,
button:focus-visible,
a:focus-visible {
  outline: none;
  box-shadow: var(--swk-focus-ring) !important;
}
input[type="checkbox"],
input[type="radio"],
input[type="range"] {
  accent-color: var(--swk-accent);
}

/* Fremdlogo: das lila BentoPDF-Zeichen in Kopf und Fuss. Der Name
   "BentoPDF" bleibt als Text stehen (Herkunft), ebenso die Fusszeile mit
   Copyright und Version (AGPL-3.0 Abschnitt 5, "Appropriate Legal Notices").
   Spenden-, GitHub- und Social-Links zeigt dieser Build schon nicht (Simple
   Mode, scripts/bentopdf-build.sh). */
img[alt="Bento PDF Logo"],
img[src*="/pdf/images/favicon"] {
  display: none !important;
}
nav span.ml-2 {
  margin-left: 0 !important;
}

/* Rollbalken */
* {
  scrollbar-color: var(--swk-scrollbar) transparent;
}