/* NEW FONT IMPORTS - Applied in index.php head for consistency */

body {
  font-family: 'Fredoka', sans-serif; /* JOST is replaced by Fredoka as main font */
  background-color: #f8f8f8; 
  margin: 0;
  padding: 20px;
  color: #333;
}

/* Headings and Titles - using the 'Bartle' font style */
.book-title, h1, h2.overlay-title {
  font-family: "BBH Sans Bartle", sans-serif; 
  font-weight: 400; /* Set to 400 as per user's provided CSS */
  font-style: normal;
}

.container {
  max-width: 900px;
  margin: 0 auto;
  background-color: #fff;
  padding: 20px;
}

/* Monochrome Button Styles */
a.button, button {
  background-color: #000; /* Schwarz */
  color: white;
  padding: 10px 15px;
  text-decoration: none;
  border-radius: 0;
  font-weight: 400; 
  border: 1px solid #000;
  cursor: pointer;
  display: inline-block;
  transition: none; /* No hover/transition */
  opacity: 1; 
  box-shadow: none;
  text-transform: uppercase;
}

.button-delete {
  background-color: #fff; /* Weisser Hintergrund */
  color: #000; /* Schwarze Schrift */
  border-color: #000;
}

/* Formulare und Input-Felder */
input[type="text"], textarea {
  width: 100%;
  padding: 10px;
  margin: 8px 0;
  display: inline-block;
  border: 1px solid #ccc;
  box-sizing: border-box;
  border-radius: 0;
  transition: none;
}

button {
  width: auto;
  margin: 8px 5px 8px 0;
}

/* No Hover/Shadow/Radius */
button:hover {
  opacity: 1;
}
.container,
.book-item,
input[type="text"],
textarea,
button,
.button {
  border-radius: 0;
  box-shadow: none;
}

/* LLM Overlay Spinner - Monochrome */
.spinner {
  border: 4px solid #f3f3f3;
  border-top: 4px solid #000; 
  border-radius: 50%;
  width: 30px;
  height: 30px;
  animation: spin 1s linear infinite;
  margin: 20px auto 0;
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}