/* ===========================================================================
   DORADOO - LESEZEICHEN AM HANDY
   ---------------------------------------------------------------------------
   Der dunkle Kreis oben rechts auf jeder Inseratskarte und am grossen Bild
   der Artikelseite. Das Theme macht ihn 40 px gross, in der Trefferliste
   sogar 56 px. Auf dem Handy ist eine Karte rund 180 px breit - der Kreis
   nimmt damit fast ein Viertel der Bildbreite ein. Hier durchgehend 32 px.

   EINE Stelle fuer alle Seiten: Startseite, Anbieterprofil, Ergebnisseite
   und Artikelseite zeigen dasselbe Lesezeichen, also soll es auch ueberall
   gleich aussehen. Bedingung der Regel: Theme doradoo, kein Pfad, nicht
   ausgenommen. Nur Handy und Tablet - auf dem Desktop bleibt es wie es ist.

   Der Selektor ist .pin und nicht .item .pin: auf der Artikelseite sitzt
   der Kreis am grossen Bild und nicht in einer Karte - mit dem engeren
   Selektor blieb er dort bei 40 px stehen, waehrend alle Karten schon
   32 px hatten.

   ---------------------------------------------------------------------------
   NOTIZ vom 01.09.2026 - Symbol und Farbe werden hier NICHT angefasst.

   Im Markup steht ein Herz (i.fa-thin.fa-heart), gezeichnet wird aber ein
   Lesezeichen. Das kommt aus dem Theme, Datei
   /themes/doradoo/css/doradoo-adjusments.css, Regel .pin .fa-heart::before:
   sie setzt content auf das Zeichen f02e - das Lesezeichen, nicht das Herz -
   dazu font: var(--fa-font-solid) und color: #fff, alles mit !important.

   Die Klasse fa-thin gehoert zu Font Awesome PRO; diese Schriftdatei wird
   nicht ausgeliefert - document.fonts.check fuer 'Font Awesome 6 Pro' gibt
   false. Sichtbar ist deshalb nur das Lesezeichen aus der Theme-Regel.

   Beim Klick tauscht /themes/doradoo/js/favorites.js die Klassen: aus
   .addtofavorite wird .removefromfavorite, aus fa-thin wird fa-solid.
   Gemerkt wird am Konto gespeichert, per POST auf /addtofavorite.

   Ein Versuch, statt des Lesezeichens ein Herz als Bild einzusetzen, wurde
   am 01.09.2026 auf Ninos Wunsch wieder zurueckgebaut. Wer das spaeter doch
   will, braucht einen Selektor, der spezifischer ist als .pin .fa-heart -
   also zum Beispiel .pin i.fa-heart::before. Sonst gewinnt das Theme.

   MERKSATZ aus demselben Tag: in einem CSS-Kommentar darf kein zweiter
   Kommentar stehen. Das Sternchen-Schraegstrich des inneren schliesst den
   aeusseren zu frueh - danach war die ganze Datei unlesbar und keine
   einzige Regel wurde geladen.
   =========================================================================== */

@media screen and (max-width: 1239px) {

  .pin {
    width: 32px !important;
    height: 32px !important;
    min-width: 0 !important;
    min-height: 0 !important;
  }

  /* Das Zeichen im gleichen Verhaeltnis mitverkleinern - das Theme setzt
     28 px, das sprengt den kleineren Kreis. */
  .pin i {
    font-size: 16px !important;
  }
}