Make movie rating dynamic

The movie rating component now accepts a 'rating' input and displays the rating value dynamically. The background color changes based on the rating, improving visual feedback for different age ratings.

src/app/movie-rating/movie-rating.component.ts

@@ -1,4 +1,4 @@
-import { Component } from '@angular/core';
+import { Component, Input } from '@angular/core';
 
 @Component({
   selector: 'app-movie-rating',
@@ -7,5 +7,23 @@ import { Component } from '@angular/core';
   styleUrl: './movie-rating.component.css'
 })
 export class MovieRatingComponent {
+  @Input() rating: number = 0;
 
+  getRatingColor(): string {
+    if (this.rating >= 18) {
+      return 'bg-red-500';
+    } else if (this.rating >= 16) {
+      return 'bg-blue-500';
+    } else if (this.rating >= 12) {
+      return 'bg-green-500';
+    } else if (this.rating >= 6) {
+      return 'bg-yellow-300';
+    } else {
+      return 'bg-white';
+    }
+  }
+
+  getRatingText(): string {
+    return `FSK ${this.rating}`;
+  }
 }