From c2f5f0f45963e48342edb0046d84b945ffe4b6a8 Mon Sep 17 00:00:00 2001
From: David Ichim <ichim.david@gmail.com>
Date: Sat, 1 Oct 2022 11:45:22 +0300
Subject: [PATCH 01/14] fix(content-box): adding of underline to links

- previous selector found even links with -box in them ignoring content as such the underline
  was wrongly applied also to the footer that had remix icons in the form of social-media-box icon
---
 theme/themes/eea/extras/contentBox.less | 4 +---
 1 file changed, 1 insertion(+), 3 deletions(-)

diff --git a/theme/themes/eea/extras/contentBox.less b/theme/themes/eea/extras/contentBox.less
index 8003f82214..6054e8ac44 100644
--- a/theme/themes/eea/extras/contentBox.less
+++ b/theme/themes/eea/extras/contentBox.less
@@ -46,9 +46,6 @@
   }
 }
 
-[class*="content-box"] a {
-  text-decoration: underline;
-}
 .content-box[class*="ary"] {
   --bg-color: transparent;
   --text-color: #FFF;
@@ -57,4 +54,5 @@
 // inherit link
 .content-box[class*="ary"] a {
   color: inherit;
+  text-decoration: underline;
 }
\ No newline at end of file

From c8b7c7e41df39e1bf6377401a7aad4220287d454 Mon Sep 17 00:00:00 2001
From: David Ichim <ichim.david@gmail.com>
Date: Sat, 1 Oct 2022 13:44:40 +0300
Subject: [PATCH 02/14] fix(content-box): z-index of box-inner and added
 underline to slate links

- if we have z-index on the box-inner the block chooser power menu will render
  below the content box area
---
 theme/themes/eea/extras/contentBox.less  | 9 +++++++--
 theme/themes/eea/extras/custom.overrides | 4 ----
 2 files changed, 7 insertions(+), 6 deletions(-)

diff --git a/theme/themes/eea/extras/contentBox.less b/theme/themes/eea/extras/contentBox.less
index 6054e8ac44..ef01f566b1 100644
--- a/theme/themes/eea/extras/contentBox.less
+++ b/theme/themes/eea/extras/contentBox.less
@@ -28,7 +28,6 @@
     padding-top: @contentBoxContainerMarginTop;
     padding-bottom: @contentBoxContainerMarginBottom;
     position: relative;
-    z-index: 1;
   }
 
   &.primary {
@@ -52,7 +51,13 @@
   --text-color-hover: @grey-1;
 }
 // inherit link
-.content-box[class*="ary"] a {
+.content-box[class*="ary"] a:not(.ui, .item) {
+  color: inherit;
+  text-decoration: underline;
+}
+
+// inherit color for slate links within context boxes
+.content-box .slate-editor-link {
   color: inherit;
   text-decoration: underline;
 }
\ No newline at end of file
diff --git a/theme/themes/eea/extras/custom.overrides b/theme/themes/eea/extras/custom.overrides
index 7d0d50a5aa..3e7e69d2ec 100644
--- a/theme/themes/eea/extras/custom.overrides
+++ b/theme/themes/eea/extras/custom.overrides
@@ -74,10 +74,6 @@
   font-weight: inherit;
 }
 
-// inherit color for slate links within context boxes
-.content-box .slate-editor-link {
-  color: inherit;
-}
 
 // customize error class from volto-slate to our color of red
 .error {

From 7aee4f1619a0d798b5fd8d90844a780c25aca019 Mon Sep 17 00:00:00 2001
From: David Ichim <ichim.david@gmail.com>
Date: Sat, 1 Oct 2022 22:51:47 +0300
Subject: [PATCH 03/14] fix(edit-interface): block chooser and power user menu
 item colors when inside content-box

---
 theme/themes/eea/extras/custom.overrides | 20 ++++++++++++++++++++
 1 file changed, 20 insertions(+)

diff --git a/theme/themes/eea/extras/custom.overrides b/theme/themes/eea/extras/custom.overrides
index 3e7e69d2ec..a951ef3e0a 100644
--- a/theme/themes/eea/extras/custom.overrides
+++ b/theme/themes/eea/extras/custom.overrides
@@ -80,6 +80,26 @@
     color: @red-5;
 }
 
+.power-user-menu,
+.blocks-chooser {
+  --text-color: @textColor;
+}
+.blocks-chooser {
+  .searchbox {
+    height: auto !important;
+  }
+  .input {
+    width: auto !important;
+  }
+  .clear-search-button {
+    padding: 0.5rem;
+  }
+  .icon {
+    margin-right: 0 !important;
+  }
+}
+
+
 // ensure background of content-box goes above the content area
 // draft image for non published pages
 .view-viewview:not(.wf-state-published) .content-area {

From e2ac13ea56a74b2f7a22abc274bc94c770fbe3a2 Mon Sep 17 00:00:00 2001
From: David Ichim <ichim.david@gmail.com>
Date: Sat, 1 Oct 2022 23:01:04 +0300
Subject: [PATCH 04/14] change(accordion): accordion titles with themes colors
 can now be modified by css variables

- introduced variables for each theme ending with CSSVar this way if that variable is used it
  can be customized by a css rule
- use text color for breadcrumb instead of tertiary color
---
 theme/themes/eea/collections/breadcrumb.variables | 2 +-
 theme/themes/eea/elements/input.overrides         | 3 +++
 theme/themes/eea/globals/site.variables           | 5 +++++
 theme/themes/eea/modules/accordion.overrides      | 6 +++---
 theme/themes/eea/modules/accordion.variables      | 4 ++--
 5 files changed, 14 insertions(+), 6 deletions(-)

diff --git a/theme/themes/eea/collections/breadcrumb.variables b/theme/themes/eea/collections/breadcrumb.variables
index dff962bed6..14b7300c8b 100644
--- a/theme/themes/eea/collections/breadcrumb.variables
+++ b/theme/themes/eea/collections/breadcrumb.variables
@@ -46,5 +46,5 @@
 /*-------------------
        States
 --------------------*/
-@activeColor: @tertiaryColor;
+@activeColor: @textColor;
 @activeFontWeight: @normal;
diff --git a/theme/themes/eea/elements/input.overrides b/theme/themes/eea/elements/input.overrides
index 84c29d1bdc..f5c1b49ae9 100644
--- a/theme/themes/eea/elements/input.overrides
+++ b/theme/themes/eea/elements/input.overrides
@@ -78,6 +78,9 @@
   max-width: 100%;
 }
 
+.accordion-title:not(.active) .ui.input input {
+  color: @textColorCSSVar;
+}
 .ui.input input {
   border: @border;
 
diff --git a/theme/themes/eea/globals/site.variables b/theme/themes/eea/globals/site.variables
index 19d59bf792..2e44db7086 100644
--- a/theme/themes/eea/globals/site.variables
+++ b/theme/themes/eea/globals/site.variables
@@ -55,8 +55,11 @@
 --------------------*/
 
 @primaryColor         : @darkCerulean;
+@primaryColorCSSVar   : var(--primary-color, @primaryColor);
 @secondaryColor       : @pineGreen;
+@secondaryColorCSSVar : var(--secondary-color, @secondaryColor);
 @tertiaryColor        : @deepBlue;
+@tertiaryColorCSSVar  : var(--tertiary-color, @tertiaryColor);
 
 @lightPrimaryColor    : @mediumPersianBlue;
 @lightSecondaryColor  : @darkCyan;
@@ -181,6 +184,8 @@
 @lineHeight          : @font-lineheight-3;
 @mobileLineHeight    : @font-lineheight-3;
 @textColor           : @tertiaryColor;
+// use this variable when you want it to be replaced by css variables
+@textColorCSSVar     : var(--text-color, @textColor);
 @contentAreaColor    : @tertiaryColor;
 
 /*-------------------
diff --git a/theme/themes/eea/modules/accordion.overrides b/theme/themes/eea/modules/accordion.overrides
index 8ae2d5c2d0..92c4c79498 100644
--- a/theme/themes/eea/modules/accordion.overrides
+++ b/theme/themes/eea/modules/accordion.overrides
@@ -122,7 +122,7 @@
 }
 .ui.accordion.primary .title:not(.active):hover,
 .ui.accordion.primary .title:not(.active):hover i {
-  color: @primaryColor;
+  color: @primaryColorCSSVar;
 }
 
 /* Secondary */
@@ -131,7 +131,7 @@
 }
 .ui.accordion.secondary .title:not(.active):hover,
 .ui.accordion.secondary .title:not(.active):hover i {
-  color: @secondaryColor;
+  color: @secondaryColorCSSVar;
 }
 
 /* Tertiary */
@@ -140,5 +140,5 @@
 }
 .ui.accordion.tertiary .title:not(.active):hover,
 .ui.accordion.tertiary .title:not(.active):hover i {
-  color: @tertiaryColor;
+  color: @tertiaryColorCSSVar;
 }
\ No newline at end of file
diff --git a/theme/themes/eea/modules/accordion.variables b/theme/themes/eea/modules/accordion.variables
index 4eb11ab321..af4a2bbcef 100644
--- a/theme/themes/eea/modules/accordion.variables
+++ b/theme/themes/eea/modules/accordion.variables
@@ -10,7 +10,7 @@
 @titlePadding: 1rem 1.563rem;
 @titlePadding: @rectangleMedium;
 @titleFontSize: 1.125rem;
-@titleColor: var(--text-color, @textColor);
+@titleColor: @textColorCSSVar;
 @titleBorderBottom: @1px solid @silverGray;
 @titleColorHover:var(--text-color-hover, @grey-5);
 @titleJustifyContent: space-between;
@@ -32,7 +32,7 @@
 ;
 @iconVerticalAlign: baseline;
 @iconTransform: none;
-@iconColorHover: @grey-5;
+@iconColorHover: @titleColorHover;
 @iconInactive: "\ea4e"; // Icon of closed accordion
 @iconActive: "\EA78"; // Icon of open accordion
 @iconOrder: 1; // Icon after text of the title

From a332961e1c4d55cdee3a8bcdf652f53cf03e251b Mon Sep 17 00:00:00 2001
From: David Ichim <ichim.david@gmail.com>
Date: Mon, 3 Oct 2022 18:03:50 +0300
Subject: [PATCH 05/14] change(styling): modified naming of theme css variables

- lining them with that I've defined previously in volto-listing-block
---
 theme/themes/eea/globals/site.variables | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

diff --git a/theme/themes/eea/globals/site.variables b/theme/themes/eea/globals/site.variables
index 2e44db7086..1c420f9284 100644
--- a/theme/themes/eea/globals/site.variables
+++ b/theme/themes/eea/globals/site.variables
@@ -55,11 +55,11 @@
 --------------------*/
 
 @primaryColor         : @darkCerulean;
-@primaryColorCSSVar   : var(--primary-color, @primaryColor);
+@primaryColorCSSVar   : var(--text-color-primary, @primaryColor);
 @secondaryColor       : @pineGreen;
-@secondaryColorCSSVar : var(--secondary-color, @secondaryColor);
+@secondaryColorCSSVar : var(--text-color-secondary, @secondaryColor);
 @tertiaryColor        : @deepBlue;
-@tertiaryColorCSSVar  : var(--tertiary-color, @tertiaryColor);
+@tertiaryColorCSSVar  : var(--text-color-tertiary, @tertiaryColor);
 
 @lightPrimaryColor    : @mediumPersianBlue;
 @lightSecondaryColor  : @darkCyan;

From 940d1b8ed815b1a38f78d7602f0b221b48fe21f9 Mon Sep 17 00:00:00 2001
From: David Ichim <ichim.david@gmail.com>
Date: Mon, 3 Oct 2022 20:55:37 +0300
Subject: [PATCH 06/14] change(colors): in lists and callouts to allow color
 changes

- also added border color css variables allowing us to modify the color of borders
---
 theme/themes/eea/elements/list.variables  | 2 +-
 theme/themes/eea/extras/callout.variables | 6 +++---
 theme/themes/eea/extras/contentBox.less   | 1 +
 theme/themes/eea/globals/site.variables   | 4 ++++
 4 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/theme/themes/eea/elements/list.variables b/theme/themes/eea/elements/list.variables
index 4a8c5675ba..039d43b00c 100644
--- a/theme/themes/eea/elements/list.variables
+++ b/theme/themes/eea/elements/list.variables
@@ -182,7 +182,7 @@
 /* Ordered List */
 @orderedCountName: ordered;
 @orderedCountContent: counters(ordered, ".") " ";
-@orderedCountColor: @primaryColor;
+@orderedCountColor: inherit;
 @orderedCountDistance: 1.25rem;
 @orderedCountOpacity: 1;
 @orderedCountTextAlign: right;
diff --git a/theme/themes/eea/extras/callout.variables b/theme/themes/eea/extras/callout.variables
index 9272f9d1b1..857f09fc6d 100644
--- a/theme/themes/eea/extras/callout.variables
+++ b/theme/themes/eea/extras/callout.variables
@@ -2,11 +2,11 @@
             Callout
 *******************************/
 /* Body */
-@mobileCalloutBorderLeft : @5px solid @secondaryColor;
-@tabletCalloutBorderLeft : @10px solid @secondaryColor;
+@mobileCalloutBorderLeft : @5px solid @borderColorSecondaryCSSVar;
+@tabletCalloutBorderLeft : @10px solid @borderColorSecondaryCSSVar;
 
 /* Text */
-@quoteColor            : @japaneseIndigo;
+@quoteColor            : @textColorCSSVar;
 @mobileQuoteFontSize   : 1rem;
 @tabletQuoteFontSize   : @h6;
 @computerQuoteFontSize : @h5;
diff --git a/theme/themes/eea/extras/contentBox.less b/theme/themes/eea/extras/contentBox.less
index ef01f566b1..d92562029e 100644
--- a/theme/themes/eea/extras/contentBox.less
+++ b/theme/themes/eea/extras/contentBox.less
@@ -47,6 +47,7 @@
 
 .content-box[class*="ary"] {
   --bg-color: transparent;
+  --border-color-secondary: #FFF;
   --text-color: #FFF;
   --text-color-hover: @grey-1;
 }
diff --git a/theme/themes/eea/globals/site.variables b/theme/themes/eea/globals/site.variables
index 1c420f9284..42fbdd3ab4 100644
--- a/theme/themes/eea/globals/site.variables
+++ b/theme/themes/eea/globals/site.variables
@@ -186,6 +186,10 @@
 @textColor           : @tertiaryColor;
 // use this variable when you want it to be replaced by css variables
 @textColorCSSVar     : var(--text-color, @textColor);
+@borderColorCSSVar   : var(--border-color, @grey-3);
+@borderColorPrimaryCSSVar: var(--border-color-primary, @primaryColor);
+@borderColorSecondaryCSSVar: var(--border-color-secondary, @secondaryColor);
+@borderColorTertiaryCSSVar: var(--border-color-tertiary, @tertiaryColor);
 @contentAreaColor    : @tertiaryColor;
 
 /*-------------------

From 28b43c72b9fcfeb153ac7e734bbbca67f2e42111 Mon Sep 17 00:00:00 2001
From: David Ichim <ichim.david@gmail.com>
Date: Mon, 3 Oct 2022 21:02:13 +0300
Subject: [PATCH 07/14] change(content-box): override primary text color to
 white as well

- useful for accordions hover titles
---
 theme/themes/eea/extras/contentBox.less | 1 +
 1 file changed, 1 insertion(+)

diff --git a/theme/themes/eea/extras/contentBox.less b/theme/themes/eea/extras/contentBox.less
index d92562029e..90e6a93844 100644
--- a/theme/themes/eea/extras/contentBox.less
+++ b/theme/themes/eea/extras/contentBox.less
@@ -49,6 +49,7 @@
   --bg-color: transparent;
   --border-color-secondary: #FFF;
   --text-color: #FFF;
+  --text-color-primary: @grey-1;
   --text-color-hover: @grey-1;
 }
 // inherit link

From 6660e2e49c6e732a13283ad7c922c5a5091bffc1 Mon Sep 17 00:00:00 2001
From: David Ichim <ichim.david@gmail.com>
Date: Tue, 4 Oct 2022 16:59:52 +0300
Subject: [PATCH 08/14] change(tags, items): use text color with css variable
 for content color for easy customization

---
 theme/themes/eea/extras/tag.variables     | 2 +-
 theme/themes/eea/extras/tagList.variables | 2 +-
 theme/themes/eea/views/item.variables     | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/theme/themes/eea/extras/tag.variables b/theme/themes/eea/extras/tag.variables
index 30a4e25d03..79420db257 100644
--- a/theme/themes/eea/extras/tag.variables
+++ b/theme/themes/eea/extras/tag.variables
@@ -13,7 +13,7 @@
 
 /* Tag text */
 @tagNameFontSize       : 1rem;
-@tagNameFontColor      : @japaneseIndigo;
+@tagNameFontColor      : @textColorCSSVar;
 @tagNameFontColorWithBackground : @white;
 @tagNameFontWeight     : 500;
 @tagNameLineHeight     : 1.25rem;
diff --git a/theme/themes/eea/extras/tagList.variables b/theme/themes/eea/extras/tagList.variables
index 3da83f18dc..0e46d5cede 100644
--- a/theme/themes/eea/extras/tagList.variables
+++ b/theme/themes/eea/extras/tagList.variables
@@ -6,7 +6,7 @@
 @tagsBodyWidth             : 100%;
 
 /* Tags Title */
-@tagsTitleFontColor        : @japaneseIndigo;
+@tagsTitleFontColor        : @textColorCSSVar;
 @tagsTitleMargin           : 1rem;
 @tagsFontWeight            : 400;
 @tagsFontSize              : 1.125rem;
diff --git a/theme/themes/eea/views/item.variables b/theme/themes/eea/views/item.variables
index 2aa16ed506..2b5515c019 100644
--- a/theme/themes/eea/views/item.variables
+++ b/theme/themes/eea/views/item.variables
@@ -113,7 +113,7 @@
 @descriptionMaxWidth: auto;
 @descriptionFontSize: 1em;
 @descriptionLineHeight: @lineHeight;
-@descriptionColor: @textColor;
+@descriptionColor: @textColorCSSVar;
 
 /* Content Image */
 @contentImageWidth: '';

From de703661065648968903bb6b46efc13d19c51d2b Mon Sep 17 00:00:00 2001
From: David Ichim <ichim.david@gmail.com>
Date: Tue, 4 Oct 2022 17:26:39 +0300
Subject: [PATCH 09/14] change(item): moved svg filter definitions to
 item.overrides

- when running the package inside eea-website-frontend it didn't
  find the variable definition when it was placed within item.less
---
 theme/themes/eea/definitions/views/item.less | 12 ------------
 theme/themes/eea/views/item.overrides        | 13 +++++++++++++
 2 files changed, 13 insertions(+), 12 deletions(-)

diff --git a/theme/themes/eea/definitions/views/item.less b/theme/themes/eea/definitions/views/item.less
index 0bb824392e..40009094e6 100644
--- a/theme/themes/eea/definitions/views/item.less
+++ b/theme/themes/eea/definitions/views/item.less
@@ -61,18 +61,6 @@
 /*--------------
       Item
 ---------------*/
-// color item images that are svg files
-.item.primary img {
-    filter: @itemPrimaryFilterColor;
-}
-
-.item.secondary img {
-    filter: @itemSecondaryFilterColor;
-}
-
-.item.tertiary img {
-    filter: @itemTertiaryFilterColor;
-}
 
 .ui.items > .item:after {
   display: block;
diff --git a/theme/themes/eea/views/item.overrides b/theme/themes/eea/views/item.overrides
index f9c2d3d9b9..e74dedf357 100644
--- a/theme/themes/eea/views/item.overrides
+++ b/theme/themes/eea/views/item.overrides
@@ -70,6 +70,19 @@
   }
 }
 
+// color item images that are svg files
+.item.primary img {
+  filter: @itemPrimaryFilterColor;
+}
+
+.item.secondary img {
+  filter: @itemSecondaryFilterColor;
+}
+
+.item.tertiary img {
+  filter: @itemTertiaryFilterColor;
+}
+
 // decrease margin when using icons instead of images
 // since the icons have themselves extra whitespace
 // and we should aim to get about 32px as seen in the figma design

From 7a3231228c2eb9b420cc7b59a4a07fba96643e5e Mon Sep 17 00:00:00 2001
From: David Ichim <ichim.david@gmail.com>
Date: Tue, 4 Oct 2022 18:24:16 +0300
Subject: [PATCH 10/14] change(quote): use secondary css var for easier color
 replacement

---
 theme/themes/eea/extras/contentBox.less | 1 +
 theme/themes/eea/extras/quote.variables | 4 ++--
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/theme/themes/eea/extras/contentBox.less b/theme/themes/eea/extras/contentBox.less
index 90e6a93844..b380b5e125 100644
--- a/theme/themes/eea/extras/contentBox.less
+++ b/theme/themes/eea/extras/contentBox.less
@@ -50,6 +50,7 @@
   --border-color-secondary: #FFF;
   --text-color: #FFF;
   --text-color-primary: @grey-1;
+  --text-color-secondary: @grey-1;
   --text-color-hover: @grey-1;
 }
 // inherit link
diff --git a/theme/themes/eea/extras/quote.variables b/theme/themes/eea/extras/quote.variables
index 29456ed493..47ff0cdb71 100644
--- a/theme/themes/eea/extras/quote.variables
+++ b/theme/themes/eea/extras/quote.variables
@@ -16,7 +16,7 @@
 @tabletQuotePadding  : 0.5rem 0 1rem;
 
 /* Source */
-@sourceTextColor     : @secondaryColor;
+@sourceTextColor     : @secondaryColorCSSVar;
 @sourceTextAlign     : right;
 @sourceFontWeight    : @bold;
 @sourceFontSize      : 1.25rem;
@@ -30,5 +30,5 @@
 /* Icon */
 @mobileQuoteIconSize : 2rem;
 @tabletQuoteIconSize : 3rem;
-@quoteIconColor      : @secondaryColor;
+@quoteIconColor      : @secondaryColorCSSVar;
 @quoteDownIconFloat  : right;
\ No newline at end of file

From 8c046704871c7202406ff71b280a8a34e195e54d Mon Sep 17 00:00:00 2001
From: David Ichim <ichim.david@gmail.com>
Date: Tue, 4 Oct 2022 18:25:13 +0300
Subject: [PATCH 11/14] change(list,bullet): color is no longer primary instead
 it's text color css variant

- this way we can modify it when needed
---
 theme/themes/eea/elements/list.variables | 10 +++++-----
 1 file changed, 5 insertions(+), 5 deletions(-)

diff --git a/theme/themes/eea/elements/list.variables b/theme/themes/eea/elements/list.variables
index 039d43b00c..252cf3d007 100644
--- a/theme/themes/eea/elements/list.variables
+++ b/theme/themes/eea/elements/list.variables
@@ -47,7 +47,7 @@
 @imageAlign: top;
 
 /* Item */
-@itemColor: @primaryColor;
+@itemColor: @textColorCSSVar;
 
 /* Content */
 @contentDistance: 0.5em;
@@ -58,7 +58,7 @@
 /* Header */
 @itemHeaderFontFamily: @headerFont;
 @itemHeaderFontWeight: @bold;
-@itemHeaderColor: @textColor;
+@itemHeaderColor: @textColorCSSVar;
 
 /* Description */
 @itemDescriptionColor: rgba(0, 0, 0, 0.7);
@@ -170,13 +170,13 @@
 
 @bulletOpacity: 1;
 @bulletCharacter: '•';
-@bulletColor: @primaryColor;
-@bulletLinkColor: @primaryColor;
+@bulletColor: @textColorCSSVar;
+@bulletLinkColor: @primaryColorCSSVar;
 @bulletVerticalAlign: top;
 @bulletChildDistance: @bulletDistance;
 
 /* Horizontal Bullets */
-@horizontalBulletColor: @primaryColor;
+@horizontalBulletColor: @textColorCSSVar;
 @horizontalBulletSpacing: @bulletDistance + 0.5em;
 
 /* Ordered List */

From 6590baf1716867eabe897e765ae1924122ba2333 Mon Sep 17 00:00:00 2001
From: David Ichim <ichim.david@gmail.com>
Date: Tue, 4 Oct 2022 21:03:49 +0300
Subject: [PATCH 12/14] change(accordion): allow customization of accordion
 title background color

---
 theme/themes/eea/modules/accordion.variables | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/theme/themes/eea/modules/accordion.variables b/theme/themes/eea/modules/accordion.variables
index af4a2bbcef..5b2ba03d67 100644
--- a/theme/themes/eea/modules/accordion.variables
+++ b/theme/themes/eea/modules/accordion.variables
@@ -63,7 +63,7 @@
 --------------------*/
 
 @activeIconTransform: none;
-@activeTitleBackground: @white;
+@activeTitleBackground: var(--bg-color, @white);
 @activeTitleColor: @grey-5;
 @activeTitleBorderBottom: 0;
 
@@ -73,7 +73,7 @@
 
 /* Styled */
 @styledWidth: 600px;
-@styledBackground: @white;
+@styledBackground: @activeTitleBackground;
 @styledBorderRadius: 0;
 @styledBoxShadow: none;
 

From b7e68311f77a724c49a3cf858a76239ca5f6876c Mon Sep 17 00:00:00 2001
From: David Ichim <ichim.david@gmail.com>
Date: Tue, 4 Oct 2022 21:44:23 +0300
Subject: [PATCH 13/14] change(colors): added backgroundColor color variable

- use css variant of background color within the table
  hover color so that we can remove it on content boxes
- set bg color also for tertiary color within content box
  with a theme
---
 theme/themes/eea/collections/table.variables | 2 +-
 theme/themes/eea/extras/contentBox.less      | 1 +
 theme/themes/eea/globals/site.variables      | 2 ++
 3 files changed, 4 insertions(+), 1 deletion(-)

diff --git a/theme/themes/eea/collections/table.variables b/theme/themes/eea/collections/table.variables
index 6ff8b2f068..57f85ca69b 100644
--- a/theme/themes/eea/collections/table.variables
+++ b/theme/themes/eea/collections/table.variables
@@ -1,7 +1,7 @@
 /*******************************
              Table
 *******************************/
-@tableHoverBackgroundColor: #F9F9F9;
+@tableHoverBackgroundColor: @backgroundColorCSSVar;
 
 /*-------------------
        Element
diff --git a/theme/themes/eea/extras/contentBox.less b/theme/themes/eea/extras/contentBox.less
index b380b5e125..3dd071614f 100644
--- a/theme/themes/eea/extras/contentBox.less
+++ b/theme/themes/eea/extras/contentBox.less
@@ -51,6 +51,7 @@
   --text-color: #FFF;
   --text-color-primary: @grey-1;
   --text-color-secondary: @grey-1;
+  --text-color-tertiary: @grey-1;
   --text-color-hover: @grey-1;
 }
 // inherit link
diff --git a/theme/themes/eea/globals/site.variables b/theme/themes/eea/globals/site.variables
index 42fbdd3ab4..01fa66be10 100644
--- a/theme/themes/eea/globals/site.variables
+++ b/theme/themes/eea/globals/site.variables
@@ -191,6 +191,8 @@
 @borderColorSecondaryCSSVar: var(--border-color-secondary, @secondaryColor);
 @borderColorTertiaryCSSVar: var(--border-color-tertiary, @tertiaryColor);
 @contentAreaColor    : @tertiaryColor;
+@backgroundColor: @grey-1;
+@backgroundColorCSSVar: var(--bg-color, @backgroundColor);
 
 /*-------------------
       Paragraph

From 1f5262af2b90d2ffd9dd5560232f3bf47bcc85e3 Mon Sep 17 00:00:00 2001
From: David Ichim <ichim.david@gmail.com>
Date: Tue, 4 Oct 2022 21:56:41 +0300
Subject: [PATCH 14/14] change(colors): added backgroundColorSupplementary
 color variable

- as defined in docusaurus our main bg color is white but we
  also have a supplementary bg color which is now set to F9F9F9
  as such we need to define this color as well
- use pure white for text color of themed content boxes
---
 theme/themes/eea/extras/contentBox.less | 8 ++++----
 theme/themes/eea/globals/site.variables | 4 +++-
 2 files changed, 7 insertions(+), 5 deletions(-)

diff --git a/theme/themes/eea/extras/contentBox.less b/theme/themes/eea/extras/contentBox.less
index 3dd071614f..63968ef409 100644
--- a/theme/themes/eea/extras/contentBox.less
+++ b/theme/themes/eea/extras/contentBox.less
@@ -49,10 +49,10 @@
   --bg-color: transparent;
   --border-color-secondary: #FFF;
   --text-color: #FFF;
-  --text-color-primary: @grey-1;
-  --text-color-secondary: @grey-1;
-  --text-color-tertiary: @grey-1;
-  --text-color-hover: @grey-1;
+  --text-color-primary: #FFF;
+  --text-color-secondary: #FFF;
+  --text-color-tertiary: #FFF;
+  --text-color-hover: @backgroundColorSupplementary;
 }
 // inherit link
 .content-box[class*="ary"] a:not(.ui, .item) {
diff --git a/theme/themes/eea/globals/site.variables b/theme/themes/eea/globals/site.variables
index 01fa66be10..f9a64bb4f2 100644
--- a/theme/themes/eea/globals/site.variables
+++ b/theme/themes/eea/globals/site.variables
@@ -191,8 +191,10 @@
 @borderColorSecondaryCSSVar: var(--border-color-secondary, @secondaryColor);
 @borderColorTertiaryCSSVar: var(--border-color-tertiary, @tertiaryColor);
 @contentAreaColor    : @tertiaryColor;
-@backgroundColor: @grey-1;
+@backgroundColor: @grey-0;
 @backgroundColorCSSVar: var(--bg-color, @backgroundColor);
+@backgroundColorSupplementary: @grey-1;
+@backgroundColorSupplementaryCSSVar: var(--bg-color-supplementary, @backgroundColorSupplementary);
 
 /*-------------------
       Paragraph