/* =========================================
   (Optional) Falange Punk lokal laden
   - Nur nötig, wenn dein Theme die Schrift NICHT bereitstellt.
   - Lege die Datei unter: wp-content/plugins/choombook/assets/fonts/falange-punk.woff2
   ========================================= */
@font-face{
  font-family: "Falange Punk";
  src: url("../fonts/falange-punk.woff2") format("woff2");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}

/* =========================================
   Formular – deine Vorgaben
   ========================================= */
.choombook-input{
  background:#fff !important;
  color:#000 !important;
  border:1px solid rgba(255,255,255,0.15);
}

/* =========================================
   Wall – Grundthema
   ========================================= */
:root{
  --choombook-brand:#ffffff; /* wird per Inline-Style aus Settings gesetzt */
  --choombook-radius:14px;
}

.choombook-wall-dark { background:#0f0f10; color:#fff; }
.choombook-wall-light{ background:#efefef; color:#111; }

.choombook-wall{
  background-image: repeating-linear-gradient(
    0deg,
    rgba(255,255,255,0.03),
    rgba(255,255,255,0.03) 1px,
    transparent 1px,
    transparent 12px
  );
}

/* =========================================
   Signatur (Profilname – Falange Punk)
   ========================================= */
.choombook-signature{
  font-family: "Falange Punk", "Impact", "Anton", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  font-size: clamp(2rem, 4vw, 3.4rem);
  line-height: 0.95;
  color:#fff;
  text-shadow:
      0 0 1px rgba(255,255,255,0.85),
      0 0 8px rgba(255,255,255,0.25);
  transform: rotate(-3deg);
  transform-origin: left center;
  letter-spacing: .5px;
  font-weight: 700; /* Falange Punk ignoriert ggf., schadet aber nicht */
}
.choombook-wall-light .choombook-signature{
  color:#000;
  text-shadow: 0 0 1px rgba(0,0,0,.7), 0 0 8px rgba(0,0,0,.1);
}

.choombook-link{
  color: inherit;
  text-decoration: none;
  border-bottom: 2px solid transparent;
}
.choombook-link:hover{
  border-bottom-color: var(--choombook-brand);
}

/* =========================================
   Avatar – quadratisch links
   ========================================= */
.choombook-avatar-sq{
  width:84px; height:84px;
  border-radius: 8px;
  object-fit: cover;
  background:#222;
  display:block;
  box-shadow: 0 0 0 2px rgba(255,255,255,0.25);
}
.choombook-avatar--placeholder{
  background: linear-gradient(135deg, rgba(255,255,255,0.18), rgba(255,255,255,0.05));
}

/* =========================================
   Nachricht – Blender Pro Book (kommt vom Theme)
   ========================================= */
.choombook-message{
  font-family: "Blender Pro Book","Blender Pro","Helvetica Neue",Arial,ui-sans-serif,system-ui;
  font-size: clamp(1.6rem, 2.6vw, 3rem);
  line-height: 1.08;
  color:#fff;
  max-width: 32ch;
}
.choombook-wall-light .choombook-message{ color:#111; }
.choombook-message p{ margin:0 0 .35em; }
.choombook-message p:last-child{ margin-bottom:0; }

/* Mobile: Avatar kleiner, Text skaliert */
@media (max-width: 576px){
  .choombook-avatar-sq{ width:68px; height:68px; }
  .choombook-message{ font-size: clamp(1.4rem, 5vw, 2.2rem); }
}