From 665f3a4495055950d4a92d6ad9a660c96985ea52 Mon Sep 17 00:00:00 2001
From: Dani Palou <dani@moodle.com>
Date: Fri, 16 Dec 2022 14:56:43 +0100
Subject: [PATCH] MOBILE-4081 quiz: Fix timer red color

---
 src/addons/mod/quiz/pages/player/player.scss | 18 ++++++++++--------
 1 file changed, 10 insertions(+), 8 deletions(-)

diff --git a/src/addons/mod/quiz/pages/player/player.scss b/src/addons/mod/quiz/pages/player/player.scss
index ca4062557..4569e5005 100644
--- a/src/addons/mod/quiz/pages/player/player.scss
+++ b/src/addons/mod/quiz/pages/player/player.scss
@@ -13,15 +13,17 @@ $quiz-timer-iterations: 15 !default;
         border-bottom: 1px solid var(--stroke);
     }
 
-    core-timer .core-timer {
-        // Make the timer go red when it's reaching 0.
-        @for $i from 0 through $quiz-timer-iterations {
-            &.core-timer-timeleft-#{$i} {
-                background-color: rgba($quiz-timer-warn-color, 1 - ($i / $quiz-timer-iterations)) !important;
+    core-timer ::ng-deep {
+        .core-timer {
+            // Make the timer go red when it's reaching 0.
+            @for $i from 0 through $quiz-timer-iterations {
+                &.core-timer-timeleft-#{$i} {
+                    background-color: rgba($quiz-timer-warn-color, 1 - ($i / $quiz-timer-iterations)) !important;
 
-                @if $i <= $quiz-timer-iterations / 2 {
-                    label, span, ion-icon {
-                        color: var(--white);
+                    @if $i <= $quiz-timer-iterations / 2 {
+                        label, span, ion-icon {
+                            color: var(--white);
+                        }
                     }
                 }
             }