Match the header gap between the Cookie Report and Controls tools

There was previously a discrepancy in the header gaps between the
two tools. This change makes the gaps the same and also matches the
margin on the right and left side of the controls tool card.

Before:
http://screencast/cast/NDg1MDYyMTUzNzU4MzEwNHw0M2U4ODg1YS0yMg

After:
http://screencast/cast/NjM2MjgwMDgzNzM2MTY2NHxmNDIxYzQ0OS02Zg

Bug: b/391607585
Change-Id: Ic0baff6eb5826cf2d3cbed09cd2c5f43195ae3ad
Reviewed-on: https://chromium-review.googlesource.com/c/devtools/devtools-frontend/+/6191249
Reviewed-by: Nancy Li <[email protected]>
Reviewed-by: Shuran Huang <[email protected]>
Commit-Queue: Joshua Thomas <[email protected]>
Reviewed-by: Danil Somsikov <[email protected]>

Author: masnoble

front_end/panels/security/cookieControlsView.css

@@ -11,11 +11,14 @@
 .controls {
   display: flex;
   flex-direction: column;
-  padding: var(--sys-size-5) var(--sys-size-8) var(--sys-size-5) var(--sys-size-5);
+  padding: var(--sys-size-5) var(--sys-size-3) var(--sys-size-5) var(--sys-size-5);
   min-width: var(--sys-size-33);
 }
 
 .header {
+  display: flex;
+  flex-direction: column;
+  gap: var(--sys-size-5);
   padding-left: var(--sys-size-5);
 }