1 files changed, 24 insertions, 64 deletions

diff --git a/browser/themes/shared/controlcenter/panel.css b/browser/themes/shared/controlcenter/panel.css
index d7685cdc69..b8ba6b72e4 100644
--- a/browser/themes/shared/controlcenter/panel.css
+++ b/browser/themes/shared/controlcenter/panel.css
@@ -295,42 +295,8 @@
   display: inline;
 }
 
-#protections-popup-sendReportView-description > label {
-  display: inline;
-}
-
 /* CONTENT BLOCKING / TRACKING PROTECTION */
 
-#protections-popup-sendReportView-heading,
-#protections-popup-sendReportView-body,
-#protections-popup-siteNotWorkingView-body {
-  padding: var(--vertical-section-padding) var(--horizontal-padding);
-}
-
-.protections-popup-sendReportView-collection-section {
-  margin-bottom: 16px;
-}
-
-#protections-popup-sendReportView-collection-url {
-  appearance: none;
-  border: none;
-  margin: 4px 0;
-}
-
-#protections-popup-sendReportView-collection-comments {
-  height: 120px;
-  resize: vertical;
-}
-
-.protections-popup-sendReportView-collection-section label {
-  margin-bottom: 2px;
-}
-
-#protections-popup-sendReportView-report-error {
-  margin-bottom: 24px;
-  color: #d74345;
-}
-
 #protections-popup-not-blocking-section-why:hover,
 #protections-popup-show-report-stack:hover > .protections-popup-footer-button {
   background-color: var(--panel-item-hover-bgcolor);
@@ -402,43 +368,42 @@
 
 /* Content Blocking categories */
 
-#protections-popup-no-trackers-found-description {
-  margin: 4.85em 7.25em;
-  font-size: 1.1em;
-  text-align: center;
-  color: var(--text-color-deemphasized);
+#tracking-protection-container {
+  #protections-popup:not([detected]) & {
+    flex: 0 1 10em;
+    margin-block: var(--space-medium);
+  }
+
+  > tooltip {
+    max-width: var(--popup-width);
+  }
 }
 
 .protections-popup-section-header {
   color: var(--text-color-deemphasized);
-}
 
-:root[uidensity="compact"] .protections-popup-section-header {
-  margin-block: 4px;
+  :root[uidensity="compact"] & {
+    margin-block: 4px;
+  }
 }
 
-#tracking-protection-container > tooltip {
-  max-width: var(--popup-width);
-}
-/*
- * The category list is split into two sections: "Blocking" and "Not Blocking",
- * with five different category items distributed between them at runtime.
- * To achieve this, we use a grid layout with 12 rows: one row for each header
- * label and five rows in each section for the items.
- * Items with the "blocked" class are assigned rows 2-6, and those without
- * are assigned rows 8-12, with the headers taking rows 1 and 7.
- */
+#protections-popup-no-trackers-found-description {
+  margin: auto 7.25em;
+  font-size: 1.1em;
+  text-align: center;
+  color: var(--text-color-deemphasized);
 
-#protections-popup-no-trackers-found-description:not([hidden]) ~ #protections-popup-content {
-  display: none;
+  &:not([hidden]) ~ #protections-popup-content {
+    display: none;
+  }
 }
 
 #protections-popup-not-blocking-section-why {
   border-radius: 2px;
-}
 
-#protections-popup-not-blocking-section-why:hover {
-  outline: 4px solid var(--panel-item-hover-bgcolor);
+  &:hover {
+    outline: 4px solid var(--panel-item-hover-bgcolor);
+  }
 }
 
 .trackers-icon {
@@ -574,10 +539,6 @@
   font-weight: 600;
 }
 
-#protections-popup-siteNotWorkingView-body-issue-list {
-  padding-inline-start: 1em;
-}
-
 /* Protection popup footer categories */
 
 #protections-popup-trackers-blocked-counter-box {
@@ -684,8 +645,7 @@
 }
 
 .protections-popup-section-header,
-.protections-popup-switch-section-header,
-#protections-popup-siteNotWorkingView-header {
+.protections-popup-switch-section-header {
   padding: var(--arrowpanel-menuitem-padding);
   margin: var(--arrowpanel-menuitem-margin);
 }