/*
 * AnimeRadar v2.4.228 - material-feature-page-v2-4-228.css
 *
 * Seite "Feature Wunsch" innerhalb der gemeinsamen Ansicht
 * #view-roadmap.rm-2026 (Route /roadmap, Umschaltung ueber das Attribut
 * data-roadmap-entry="feature", lokal ueber /roadmap?bereich=feature).
 *
 * Diese Datei enthaelt ausschliesslich den Host-Container der Feature-Seite.
 *   - Der Hero .rm-hero-feature liegt in material-roadmap-shell-v2-4-228.css.
 *   - Das gemeinsame Formular .rm-feedback liegt in
 *     material-feedback-form-v2-4-228.css und wird per JS in den Host
 *     #roadmapFeatureFormHost verschoben.
 * Hier wird nur die Platzierung im Host bestimmt, nicht das Aussehen der
 * Karte, der Felder oder des Knopfes.
 *
 * ---------------------------------------------------------------------------
 * Referenz: Referenzbilder/Seitendesigns/Feature Wunsch.png (1484 x 1060),
 * links Desktop, rechts Mobil im Telefon-Mockup.
 *
 * Desktop der Vorlage (Bildkoordinaten). Der Ansichtsanfang der Vorlage liegt
 * 18.5 Bildpunkte unter dem lokalen (Vorlage y 127.5 = lokal y 109):
 *   Hero            x 214 .. 1060,   y 127.5 .. 357.5   (846 x 230)
 *   Formularkarte   x 220.5 .. 1053.5, y 370.5 .. 912.5 (833 x 542)
 *   Abstand Hero -> Formularkarte: 13
 * Lokal ist die Inhaltsspalte der Shell bei Viewport 1079 genau 838 breit
 * (x 214 .. 1052). Die Karte der Vorlage ist mit 833 praktisch die volle
 * Inhaltsbreite; die 6 bzw. 7 Bildpunkte Rand links und rechts liegen
 * innerhalb der Streuung der Vorlage selbst, denn der Hero derselben Vorlage
 * misst 846 statt 838. Der Host laeuft deshalb ueber die volle Inhaltsbreite,
 * anders als auf der Seite "Bugs melden".
 *
 * Mobil der Vorlage (Bildschirm im Mockup 346 breit, lokal 390, Inhaltsspalte
 * 366, Faktor 1.099):
 *   Hero            y 213.5 .. 426.5 (213 hoch, skaliert 234)
 *   Formularkarte   x 1114.5 .. 1447.5 (333 breit, skaliert 366), oben y 436.5
 *   Abstand Hero -> Formularkarte: 10 (skaliert 11)
 * Auch mobil laeuft die Karte ueber die volle Inhaltsbreite.
 *
 * Abstand Hero -> Formular: er kommt aus der gemeinsamen Seitenregel in
 * material-roadmap-shell-v2-4-228.css (gap 14 Desktop, 12 Mobil) und wird hier
 * bewusst nicht ueberschrieben. Mit ihr liegt die Oberkante der Karte lokal
 * auf y 352 und damit exakt auf dem Wert der Vorlage (370.5 - 18.5 = 352).
 * ---------------------------------------------------------------------------
 */

/* ========================================================================== */
/* Host-Container der Feature-Seite                                           */
/* ========================================================================== */

/* Volle Inhaltsbreite, eine Spalte, Kind wird gestreckt. minmax(0, 1fr)
   verhindert, dass breite Formularinhalte die Spalte aufziehen. */
#view-roadmap.rm-2026 .rm-page-feature .rm-form-host-feature {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  align-content: start;
  width: 100%;
  min-width: 0;
  /* Vertrag der Formular-Komponente aus material-feedback-form-v2-4-228.css:
     der Host gibt die Hoechstbreite der Karte vor. Auf der Feature-Seite gibt
     es keine, die Karte fuellt die Inhaltsspalte. */
  --rm-form-max: none;
}

/* Die Karte fuellt den Host vollstaendig aus - im Gegensatz zur Seite
   "Bugs melden", auf der sie schmaler steht. Nur Breite und Platzierung,
   Aussehen bleibt in material-feedback-form-v2-4-228.css. Die Angaben sind
   die Absicherung zu --rm-form-max oben, falls sich der Vertrag aendert. */
#view-roadmap.rm-2026 .rm-page-feature .rm-form-host-feature > .rm-feedback {
  width: 100%;
  max-width: none;
  min-width: 0;
  margin-inline: 0;
}

/* Vor der ersten Zuordnung durch das JS ist der Host leer. Dann darf er weder
   Hoehe noch einen Abstand unter dem Hero erzeugen. */
#view-roadmap.rm-2026 .rm-page-feature .rm-form-host-feature:empty {
  display: none;
}

/* ========================================================================== */
/* Mobil                                                                      */
/* ========================================================================== */

@media (max-width: 959px) {
  /* Gleiche Aufteilung wie am Desktop: die Karte nimmt die volle
     Inhaltsbreite ein (Vorlage skaliert 366 bei Viewport 390). */
  #view-roadmap.rm-2026 .rm-page-feature .rm-form-host-feature,
  #view-roadmap.rm-2026 .rm-page-feature .rm-form-host-feature > .rm-feedback {
    width: 100%;
    max-width: none;
    min-width: 0;
  }
}
