/* ============================================
   FALK CAFÉ — Mastodon 4.5.6 Custom CSS
   Lim inn i: Administration > Server Settings > Appearance > Custom CSS
   ============================================ */

/* --- Fonter --- */
@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;700;800&family=Fraunces:wght@700;800;900&display=swap');


/* =====================
   1. «PIP!»-KNAPPEN
   Erstatter publiser-knappen
   ===================== */

/* Hovedknapp i compose-feltet (dekker flere Mastodon-versjoner) */
.compose-form__submit .button,
.compose-form__publish-button-wrapper .button,
.compose-form__actions .button.button--block,
.compose-form__actions > .button:last-child {
  font-size: 0 !important;
  position: relative !important;
  background: linear-gradient(135deg, #c17f59, #a5653f) !important;
  border: none !important;
  border-radius: 10px !important;
}

.compose-form__submit .button::after,
.compose-form__publish-button-wrapper .button::after,
.compose-form__actions .button.button--block::after,
.compose-form__actions > .button:last-child::after {
  content: 'Pip!' !important;
  font-size: 15px !important;
  font-family: 'DM Sans', sans-serif !important;
  font-weight: 800 !important;
  color: #fff !important;
  display: block !important;
}

/* Topbar publish-lenke (mobil/smal visning) */
.ui__header__links [href="/publish"] span {
  font-size: 0 !important;
}

.ui__header__links [href="/publish"]::after {
  content: 'Pip!' !important;
  font-size: 15px !important;
  font-weight: 800 !important;
  font-family: 'DM Sans', sans-serif !important;
}


/* =====================
   2. FARGEPALETT
   Café-varme over hele UI
   ===================== */

/* Aksent/primærfarge — lenker, aktive elementer */
.column-link.active,
.column-link:hover,
.column-link:focus {
  color: #c17f59 !important;
}

.column-link.active {
  font-weight: 700 !important;
}

/* Hashtags og lenker i poster */
.status__content a,
.reply-indicator__content a,
.hashtag-bar a {
  color: #c17f59 !important;
}

/* Knapper generelt */
.button:not(.button-secondary):not(.icon-button) {
  background: #c17f59 !important;
  border-radius: 8px !important;
}

.button:not(.button-secondary):not(.icon-button):hover {
  background: #a5653f !important;
}


/* =====================
   3. TRENDER-SIDEBAR
   Erstatter «TRENDER NÅ»-teksten
   ===================== */

/* Ingenting å endre her, men vi gir den vår farge */
.trends__item__sparkline path:last-child {
  stroke: #c17f59 !important;
}

.trends__item__sparkline path:first-child {
  fill: rgba(193, 127, 89, 0.15) !important;
}


/* =====================
   4. NAVIGASJON
   Varm aksent på hover/aktiv
   ===================== */

.column-link svg,
.column-link .icon {
  transition: color 0.15s ease;
}

.column-link.active svg,
.column-link:hover svg,
.column-link.active .icon,
.column-link:hover .icon {
  color: #c17f59 !important;
}


/* =====================
   5. SKILLELINJER
   Tydeligere mellom pip
   ===================== */

.status {
  border-bottom-color: rgba(193, 127, 89, 0.12) !important;
}


/* =====================
   6. AVATARER
   Avrundede firkanter istedenfor sirkel
   ===================== */

.account__avatar,
.account__avatar-overlay-base .account__avatar,
.account__avatar-overlay {
  border-radius: 12px !important;
}


/* =====================
   7. COMPOSE-FELTET
   Varmere tekstfelt
   ===================== */

.compose-form .autosuggest-textarea__textarea:focus,
.compose-form .spoiler-input__input:focus {
  border-color: #c17f59 !important;
  box-shadow: 0 0 0 3px rgba(193, 127, 89, 0.15) !important;
}

.compose-form__buttons .icon-button,
.compose-form__buttons button {
  color: #c17f59 !important;
}


/* =====================
   8. SCROLLBAR (valgfritt, kun Webkit)
   ===================== */

::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(193, 127, 89, 0.25); border-radius: 3px; }


/* =====================
   9. MASTODON-LOGO I SIDEBAR
   Skjul og erstatt med tekst
   ===================== */

.column-link--logo {
  font-size: 0 !important;
}

.column-link--logo::before {
  content: '🦅 Falk Café' !important;
  font-size: 18px !important;
  font-family: 'Fraunces', Georgia, serif !important;
  font-weight: 800 !important;
  color: #2d1b14 !important;
  letter-spacing: -0.02em !important;
}

.column-link--logo svg,
.column-link--logo .logo,
.column-link--logo img,
.logo-symbol-wordmark {
  display: none !important;
}


/* =====================
   FERDIG! ☕🦅
   Lagre, refresh, pip i vei.
   ============================================ */