/* Shared brand palette. Loaded after component styles on every public page. */
:root {
  --brand: #087f83;
  --brand-hover: #065f63;
  --brand-deep: #16474b;
  --brand-soft: #edf7f6;
  --brand-line: #87afae;
  --paper: #f7f7f7;
  --surface: #fff;
  --panel: #f3f3f3;
  --ink: #202020;
  --muted: #505050;
  --faint: #606060;
  --line: #d5dad9;
  --hair: #ebedec;
  --btn: var(--brand);
  --btn-ink: #fff;
  /* Aliases keep older shared components on the same palette. */
  --brown: var(--brand);
  --brown-deep: var(--brand);
  --brown-ink: #fff;
  --beige: #d8ccb8;
  --beige-soft: var(--panel);
  --sun: var(--brand);
  --sun-deep: var(--brand-hover);
  --sun-soft: var(--brand-soft);
  --price: var(--ink);
  --akzent: var(--brand);
  --section-space: 48px;
}

/* One spacing rhythm for the main page sections; related controls stay closer. */
.abschnitt.kategorie-einleitung{padding-top:var(--section-space);padding-bottom:0}
.katzenwahl{margin-bottom:var(--section-space)}
.kategorie-einleitung>.raster{margin-bottom:0}
.suchseite{padding-top:var(--section-space)}
.profil .profil-inhalt{padding-top:var(--section-space);padding-bottom:var(--section-space)}
@media(max-width:760px){:root{--section-space:32px}}

/* Primary actions and navigation. Status green and favorite red are separate. */
.btn:hover { opacity: 1; transform: none; }
.btn:not(.ghost):not(.light):not(.ghost-light):hover:not(:disabled),
.ins-cta.c-zucht:hover, .los:hover { background: var(--brand-hover); }
.btn.ghost, .ins-cta.c-privat {
  color: var(--brand); border-color: var(--brand-line);
}
.btn.ghost:hover, .ins-cta.c-privat:hover {
  color: var(--brand-hover); border-color: var(--brand); background: var(--brand-soft);
}
.los { background: var(--brand); }
.topbar, body > footer { background: var(--brand-deep); color: #fff; }
body > footer .logo-mark { background: #fff; padding: 6px; border-radius: 10px; }
body > footer .fgrid h3, body > footer .fbrand p { color: #e0e9e9; }
body > footer .fbot { color: #d1dfdf; }
body > header .logo { color: var(--ink); }
body > header .nav-links a, body > header .nav-links button.facet-nav,
.header-shortcuts > a, .header-shortcuts > button { color: var(--ink); }
body > header .nav-links a:hover, body > header .nav-links button.facet-nav:hover,
.header-shortcuts > a:hover, .header-shortcuts > button:hover { color: var(--brand); }
.header-shortcuts { border-color: var(--hair); }
.fav-ikone b { background: var(--brand); }
.btn:focus-visible, .ins-cta:focus-visible, .los:focus-visible,
.burger:focus-visible, .iconbtn:focus-visible, .ins-merk button:focus-visible,
body > header a:focus-visible, body > header button:focus-visible {
  outline: 2px solid var(--brand); outline-offset: 4px;
}

/* Search, categories and editorial pages. */
.fgruppe > summary::after, .fgruppe[open] > summary::after,
.fgruppe > summary:hover::after, .fgruppe[open] > summary:hover::after {
  color: var(--brand);
}
button.radio.ist-an i, a.radio.ist-an i { border-color: var(--brand); }
button.radio.ist-an i::after, a.radio.ist-an i::after { background: var(--brand); }
.radio input { accent-color: var(--brand); }
.dd-opt.ist-an, .dd-opt:hover { color: var(--brand-hover); background: var(--brand-soft); }
.dd[open] > summary, .wahlfeld select:focus, .preisreihe input:focus { border-color: var(--brand); }
.katzenwahl-nummer { background: var(--brand-soft); color: var(--brand); }
.fehler-seite { background: var(--paper); }
.fehler-karte:hover, .fehler-karte.ist-passend { background: var(--brand-soft); }
.ab-kopf a, .fl-kopf a { color: var(--brand); }
.ab-kopf a:hover, .fl-kopf a:hover { color: var(--brand-hover); border-color: var(--brand-hover); }

/* Stronger detail across listing cards and search controls. */
.ins { border-color: #cbd2d1; border-radius: 8px; box-shadow: 0 2px 7px #20202006; }
.ins:hover { border-color: var(--brand); box-shadow: 0 4px 14px #087f8310; }
.ins-text { padding: 15px; }
.ins-titel { font-size: 16px; font-weight: 750; }
.ins-meta svg, .ins:hover .ins-meta svg { color: var(--brand); }
.ins-preis { font-size: 19px; font-weight: 800; letter-spacing: -.015em; }
.ins-preis.auf-anfrage { font-size: 14px; font-weight: 650; }
.ins-cta { display: flex; align-items: center; justify-content: center; min-height: 44px; border-radius: 7px; font-weight: 700; }
.ins-geprueft { color: #28553e; font-weight: 550; }
.ins-merk button { border-color: #b5bfbd; }
.dd > summary, .preisreihe input, .wahlfeld select { border-color: #879392; }
.dd > summary::after { border-color: var(--brand); }
.dd-panel { border-color: var(--brand-line); }
.fgruppe > summary { font-weight: 750; }
.feld-etikett { color: var(--ink); font-weight: 600; }
.unterkopf { color: var(--ink); font-size: 16px; font-weight: 750; letter-spacing: 0; }
.erg-kopf { border-color: var(--line); }

/* Listing: strong dark text on white and light grey, with turquoise actions. */
.profil { --profil-linie: var(--line); background: var(--paper); color: var(--ink); }
.profil-hero, .profil-tier { border-color: var(--line); }
.profil-hero { box-shadow: 0 4px 18px #2020200a; }
.profil h1, .profil-tier h2, .profil-side-listing-bottom > b { color: var(--ink); }
.profil-etiketten > span:first-child { background: var(--panel); color: var(--muted); }
.profil-preis { background: var(--panel); }
.profil-preis strong { color: var(--ink); }
.profil-kurzangaben dt, .profil-fakten dt { color: var(--muted); font-weight: 500; }
.profil-avatar, .chat-avatar, .community-avatar { background: var(--brand-soft); color: var(--brand); }
.profil-abschnitte a { border-color: var(--line); color: var(--brand); }
.profil-abschnitte a:hover { background: var(--brand-soft); border-color: var(--brand-line); }
.profil-galerie-nav button { border-color: var(--line); color: var(--brand); }
.profil-galerie-nav button:hover { background: var(--brand-soft); }
.profil-side-provider { border: 1px solid var(--line); box-shadow: 0 2px 7px #2020200d; }
.profil-side-reviews { border-color: var(--line); }
.profil-side-review-empty { color: var(--ink); }
.profil-side-profile-link {
  background: #fff; color: var(--brand); border-color: var(--brand);
}
.profil-side-profile-link > span { color: var(--brand); }
.profil-side-profile-link:hover {
  background: var(--brand-soft); color: var(--brand-hover); border-color: var(--brand);
}
.profil-side-listing { border-color: var(--line); box-shadow: 0 2px 6px #20202009; }
.profil-side-listing:hover { border-color: var(--brand); box-shadow: 0 4px 15px #087f830b; }
.profil-side-photo, .profil-ohnefoto, .profil-lightbox { background: var(--paper); }

/* The inline chat keeps one full-width action, including the contact overlay. */
.profil-kontakt-inline .profil-formular {
  border-color: var(--line); box-shadow: 0 2px 7px #2020200a;
}
.chat-empty { background: var(--panel); border-color: #e5e5e5; }
.chat-empty > span { color: var(--brand); box-shadow: none; }
.chat-empty strong { color: var(--ink); }
.chat-shell .btn, .chat-shell .chat-entry-actions .btn,
.chat-shell .chat-compose button[type=submit], .chat-sale-card .btn, .bkh-dialog .btn {
  background: var(--brand); color: #fff; box-shadow: none;
}
/* Unavailable actions stay visibly muted without fading their text. */
.chat-shell .btn:disabled, .bkh-dialog .btn:disabled,
.chat-shell .chat-entry-actions .btn:disabled,
.chat-shell .chat-compose button[type=submit]:disabled {
  opacity: 1; background: #626f70; color: #fff; cursor: not-allowed;
}
.chat-shell .btn:hover:not(:disabled),
.chat-shell .chat-entry-actions .btn:hover:not(:disabled),
.chat-shell .chat-compose button[type=submit]:hover:not(:disabled),
.chat-sale-card .btn:hover:not(:disabled), .bkh-dialog .btn:hover:not(:disabled) {
  background: var(--brand-hover);
}
.chat-shell .chat-entry-actions .btn:focus-visible,
.chat-shell .chat-compose button[type=submit]:focus-visible,
.chat-form input:focus, .chat-form textarea:focus,
.review-stars label:has(input:focus-visible) {
  outline: 2px solid var(--brand); outline-offset: 3px;
}
.chat-form input:not([type=checkbox]):not([type=hidden]), .chat-form textarea {
  border-color: #879392;
}
.chat-form input::placeholder, .chat-form textarea::placeholder {
  color: var(--faint); opacity: 1;
}
.chat-consent input, .community-check input { accent-color: var(--brand); }
.chat-entry-stage.is-enhanced > .chat-entry-gate { border-color: var(--line); box-shadow: 0 14px 40px #27333820; }
.chat-privacy, .chat-retention, .chat-entry-preview { background: var(--panel); color: var(--ink); }
.chat-gate-close, .bkh-dialog-close { background: var(--panel); color: var(--ink); }
.chat-text-button, .chat-meta a, .chat-footer a, .chat-consent a,
.chat-demo-link, .chat-seller-tools > summary { color: var(--brand); }
.chat-policy, .chat-message > div { color: var(--muted); }
.chat-policy { font-size: 12px; }
.chat-timeline { background: var(--paper); }
.chat-message { background: #f0f1ed; }
.chat-message.own, .community-bubble.own { background: var(--brand-soft); border-color: var(--brand-line); }
.chat-sale-card { background: var(--paper); border-color: var(--line); }
.chat-contact-shared { border-color: var(--line); }
.bkh-dialog { color: var(--ink); border-color: var(--line); box-shadow: 0 25px 90px #27333835; }
.bkh-dialog::backdrop { background: #1e30366b; }
.bkh-dialog-symbol { background: var(--brand-soft); color: var(--brand); }
.bkh-dialog-intro { color: var(--muted); }
.review-stars label:not(.selected) { background: var(--paper); border-color: var(--line); }
.review-stars label:not(.selected) > span:first-of-type { color: #909b9a; }

/* Shared account surfaces also use the brand without changing success/error states. */
.community-card { border-color: var(--line); }
.community-tile:hover { background: var(--brand-soft); }
.community-tile > span { color: var(--brand); }
.community-retention, .community-handover dl, .bewertung-leer { background: var(--panel); border-color: var(--line); }
.community-photo-guide { background: var(--brand-soft); }
.community-photo-outline { border-color: var(--brand); color: var(--brand); background: #dcefed; box-shadow: inset 0 0 0 5px #fff; }
.community-photo-grid button { color: var(--brand); border-color: var(--brand-line); }
.community-rating input:checked + span { background: var(--brand); border-color: var(--brand); }
.community-rating input:focus-visible + span { outline-color: var(--brand); }

@media print {
  body:has(#chat-drucken[open]) .profil { background: #fff; }
  #chat-drucken[open] { border: 0; box-shadow: none; }
  #chat-drucken::backdrop { background: transparent; }
}

/* Editorial heading accents: the same family as the main title. */
.bkh-heading-accent{color:var(--brand)}
.katzenwahl .ab-kopf h2,.kategorie-einleitung .unterkopf,
.profil #katze-titel,.profil .profil-details-group h3{font-family:Archivo,'Hanken Grotesk',sans-serif;font-weight:800;letter-spacing:-.025em;line-height:1.2}
.katzenwahl .ab-kopf h2{font-size:clamp(26px,2.3vw,34px);text-wrap:balance}
.kategorie-einleitung .unterkopf{font-size:clamp(23px,2vw,28px)}
.profil #katze-titel{font-size:clamp(25px,2.3vw,32px)}
.profil .profil-details-group h3{font-size:20px;letter-spacing:-.015em}
