/*====================================================
  1. Palette Definitions
====================================================*/
:root {
  /* Mid Green - Deep Purple */
  --dp-bg:    #509E2F;
  --dp-text:  #fff;

  /* Pale Green - Pale Purple */
  --pp-bg:    #E0EC89;
  --pp-text:  #041204;

  /* Deep Green - Orange */
  --or-bg:    #041204;
  --or-text:  #fff;

  /* Dark Green - Bright Purple (B-P) */
  --bp-bg:    #257226;
  --bp-text:  #fff;

  /* Dark Green - Medium Purple (M-P) */
  --mp-bg:    #257226;
  --mp-text:  #fff;

  /* Light Green - Light Purple (L-P) */
  --lp-bg:    #B7DB57;
  --lp-text:  #041204;

  /* New Orange - Pink */
  --pk-bg:    #FF8F1C;
  --pk-text:  #fff;

  /* White */
  --wp-bg:    #fff;
  --wp-text:  #041204;

  /* “None” / clear */
  --none-bg:  transparent;
  --none-text: #041204;
}

/*====================================================
  2. Base theme class styling
     (explicit class selectors ensure multi-class elems work)
====================================================*/
/* Assign theme variables for each flavour */
.dpbg, .dpbox, .dpbut   { --theme-bg: var(--dp-bg);  --theme-text: var(--dp-text); }
.ppbg, .ppbox, .ppbut   { --theme-bg: var(--pp-bg);  --theme-text: var(--pp-text); }
.orbg, .orbox, .orbut   { --theme-bg: var(--or-bg);  --theme-text: var(--or-text); }
.bpbg, .bpbox, .bpbut   { --theme-bg: var(--bp-bg);  --theme-text: var(--bp-text); }
.mpbg, .mpbox, .mpbut   { --theme-bg: var(--mp-bg);  --theme-text: var(--mp-text); }
.lpbg, .lpbox, .lpbut   { --theme-bg: var(--lp-bg);  --theme-text: var(--lp-text); }
.pkbg, .pkbox, .pkbut   { --theme-bg: var(--pk-bg);  --theme-text: var(--pk-text); }
.wpbg, .wpbox, .wpbut   { --theme-bg: var(--wp-bg);  --theme-text: var(--wp-text); }
.none, .gridtitle.none  { --theme-bg: var(--none-bg); --theme-text: var(--none-text); }

/* Apply background & text-colour explicitly */
.dpbg, .dpbox, .dpbut,
.ppbg, .ppbox, .ppbut,
.orbg, .orbox, .orbut,
.bpbg, .bpbox, .bpbut,
.mpbg, .mpbox, .mpbut,
.lpbg, .lpbox, .lpbut,
.pkbg, .pkbox, .pkbut,
.wpbg, .wpbox, .wpbut,
.none {
  background-color: var(--theme-bg) !important;
  color:            var(--theme-text) !important;
}

/*====================================================
  3. Force descendants to use the theme text colour
====================================================*/
.dpbg *, .dpbox *, .dpbut *,
.ppbg *, .ppbox *, .ppbut *,
.orbg *, .orbox *, .orbut *,
.bpbg *, .bpbox *, .bpbut *,
.mpbg *, .mpbox *, .mpbut *,
.lpbg *, .lpbox *, .lpbut *,
.pkbg *, .pkbox *, .pkbut *,
.wpbg *, .wpbox *, .wpbut *,
.none * {
  color: var(--theme-text) !important;
}

/*====================================================
  4. Grid titles & banners
====================================================*/
/* Grid titles */
.gridtitle {
  background-color: var(--theme-bg) !important;
  color:            var(--theme-text) !important;
}
.gridtitle.bpbg { --theme-text: var(--bp-text); }
.gridtitle.dpbg { --theme-text: var(--dp-text); }
.gridtitle.lpbg { --theme-text: var(--lp-text); }
.gridtitle.mpbg { --theme-text: var(--mp-text); }
.gridtitle.ppbg { --theme-text: var(--pp-text); }
.gridtitle.orbg { --theme-text: var(--or-text); }
.gridtitle.pkbg { --theme-text: var(--pk-text); }
.gridtitle.wpbg { --theme-text: var(--wp-text); }

/* Contact-banner wrapper & text */
.contact-banner {
  /* theme-based background */
  background-color: var(--theme-bg) !important;
}
.contact-banner .banner-text {
  color:            var(--theme-text) !important;
}
.contact-banner.bpbg { --theme-text: var(--bp-text); }
.contact-banner.dpbg { --theme-text: var(--dp-text); }
.contact-banner.lpbg { --theme-text: var(--lp-text); }
.contact-banner.mpbg { --theme-text: var(--mp-text); }
.contact-banner.ppbg { --theme-text: var(--pp-text); }
.contact-banner.orbg { --theme-text: var(--or-text); }
.contact-banner.pkbg { --theme-text: var(--pk-text); }
.contact-banner.wpbg { --theme-text: var(--wp-text); }

/*====================================================
  5. Duo post content
====================================================*/
.duo-post-content.bpbg { background-color: var(--dp-bg); color: var(--dp-text); }
.duo-post-content.ppbg { background-color: var(--pp-bg); color: var(--pp-text); }
.duo-post-content.orbg { background-color: var(--or-bg); color: var(--or-text); }
.duo-post-content.bpbg { background-color: var(--bp-bg); color: var(--bp-text); }
.duo-post-content.mpbg { background-color: var(--mp-bg); color: var(--mp-text); }
.duo-post-content.lpbg { background-color: var(--lp-bg); color: var(--lp-text); }
.duo-post-content.pkbg { background-color: var(--pk-bg); color: var(--pk-text); }
.duo-post-content.wpbg { background-color: var(--wp-bg); color: var(--wp-text); }

/*====================================================
  6. Links in buttons & backgrounds
====================================================*/
a.dpbut, a.dpbg   { color: var(--dp-text) !important; }
a.ppbut, a.ppbg   { color: var(--pp-text) !important; }
a.orbut, a.orbg   { color: var(--or-text) !important; }
a.bpbut, a.bpbg   { color: var(--bp-text) !important; }
a.mpbut, a.mpbg   { color: var(--mp-text) !important; }
a.lpbut, a.lpbg   { color: var(--lp-text) !important; }
a.pkbut, a.pkbg   { color: var(--pk-text) !important; }
a.wpbut, a.wpbg   { color: var(--wp-text) !important; }
a.none            { color: var(--none-text) !important; }

/*====================================================
  7. Utility / clear classes
====================================================*/
.clearbox, .clearbut {
  background-color: transparent !important;
}

/*====================================================
  8. Plains & primary text overrides
====================================================*/
.acc_title, .plaintitle h3 {
  color: var(--theme-text) !important;
}
.primarytext p, .primarytext h1 {
  color: var(--theme-text) !important;
}
