Add small IFlyWarning variant in expanded flight rows (Angular warning-ifly-carrier-small parity)

src/ui/flights/FlightCard.tsx

@@ -11,6 +11,7 @@ import { StationDisplay } from "./StationDisplay.js";
 import { TimeGroup } from "./TimeGroup.js";
 import { FlightStatus } from "./FlightStatus.js";
 import { OperatorLogo } from "./OperatorLogo.js";
+import { IFlyWarning } from "./IFlyWarning.js";
 import "./FlightCard.scss";
 
 export interface FlightCardProps {
@@ -314,12 +315,20 @@ export const FlightCard: FC<FlightCardProps> = ({
           className="flight-card__expanded flight-card__expanded--custom"
           data-testid="flight-card-expanded"
         >
+          <IFlyWarning
+            flightNumber={flight.flightId.flightNumber}
+            variant="small"
+          />
           {renderExpandedBody(flight)}
         </div>
       )}
 
       {expandable && expanded && !renderExpandedBody && (
         <div className="flight-card__expanded" data-testid="flight-card-expanded">
+          <IFlyWarning
+            flightNumber={flight.flightId.flightNumber}
+            variant="small"
+          />
           <div className="flight-card__detail-row">
             <div className="flight-card__detail-label">{t("SHARED.TIME")}</div>
             <div className="flight-card__detail-group">

src/ui/flights/IFlyWarning.scss

@@ -28,4 +28,14 @@
     font-weight: fonts.$font-bold;
     color: colors.$orange--hover;
   }
+
+  // Inline variant used inside flight list rows. Mirrors Angular
+  // `warning-ifly-carrier-small`: span with padded inner text, no
+  // vertical bar, no link.
+  &--small {
+    display: block;
+    padding: vars.$space-l vars.$space-xl;
+    font-size: fonts.$font-size-s;
+    line-height: 1.5;
+  }
 }

src/ui/flights/IFlyWarning.tsx

@@ -4,6 +4,15 @@ import "./IFlyWarning.scss";
 
 export interface IFlyWarningProps {
   flightNumber: string | number;
+  /**
+   * "detail" (default) mirrors `warning-ifly-carrier-detail` — a
+   * boxed block with vertical orange bar, highlighted caption and
+   * a link. Use on details pages.
+   *
+   * "small" mirrors `warning-ifly-carrier-small` — an inline
+   * caption + body line, no bar, no link. Use inside flight rows.
+   */
+  variant?: "detail" | "small";
 }
 
 function isIFlyRange(num: string | number): boolean {
@@ -12,9 +21,19 @@ function isIFlyRange(num: string | number): boolean {
   return n > 5800 && n < 5949;
 }
 
-export const IFlyWarning: FC<IFlyWarningProps> = ({ flightNumber }) => {
+export const IFlyWarning: FC<IFlyWarningProps> = ({ flightNumber, variant = "detail" }) => {
   const { t } = useTranslation();
   if (!isIFlyRange(flightNumber)) return null;
+  if (variant === "small") {
+    return (
+      <span className="ifly-warning ifly-warning--small" data-testid="ifly-warning">
+        <span className="ifly-warning__highlight">
+          {t("WARNING.IFLY_HIGHLIGHT")}
+        </span>{" "}
+        {t("WARNING.IFLY_BODY")}
+      </span>
+    );
+  }
   return (
     <div className="ifly-warning" data-testid="ifly-warning">
       <div className="ifly-warning__bar" aria-hidden="true" />