/* stylelint-disable no-descending-specificity */
/**
 * PUIA Theme Overrides
 *
 * This file customizes PUIA site styles by overriding
 * the CSS variables and components from the parent theme.
 *
 * PUIA Brand colors:
 * - Purple: #4C2ED6
 * - Fuchsia: #FF5FB7
 */

/* =====================================================
   CSS VARIABLES
   ===================================================== */

:root {
  /* Base colors */
  --puia-white: #ffffff;
  --puia-black: #111111;
  --puia-true-black: #000000;

  /* Brand colors - Purple palette */
  --puia-purple: #4c2ed6;
  --puia-purple-dark: #3b2983;
  --puia-purple-darker: #261d4a;
  --puia-purple-light: #866dff;
  --puia-purple-bg: #ede7f4;
  --puia-purple-form-dark: #2a263e;

  /* Brand colors - Fuchsia palette */
  --puia-fuchsia: #ff5fb7;
  --puia-fuchsia-hover: #fd4e91;
  --puia-fuchsia-active: #fd68a1;
  --puia-fuchsia-dark: #bf1c66;
  --puia-fuchsia-dark-hover: #a01855;
  --puia-fuchsia-dark-active: #8a1449;
  --puia-fuchsia-bg: #ffdaee;
  --puia-fuchsia-bg-dark: #4d1f34;

  /* Yellow palette */
  --puia-yellow: #fde026;
  --puia-yellow-hover: #f5c414;
  --puia-yellow-active: #e5b412;
  --puia-yellow-dark: #af9b19;
  --puia-yellow-dark-hover: #93760c;
  --puia-yellow-dark-active: #7a6209;
  --puia-yellow-bg: #fffde8;
  --puia-yellow-bg-dark: #4d4b3a;
  --puia-yellow-highcontrast: #ffcd00;
}

/* =====================================================
   UTILITY OVERRIDES
   ===================================================== */

.bg-main-5 {
  background-color: var(--puia-white);
}

.dark .bg-main-5 {
  background-color: var(--puia-purple-darker) !important;
}

.bg-yellow-4 {
  background-color: var(--puia-yellow-bg);
}

.dark .bg-yellow-4 {
  background-color: var(--puia-yellow-bg-dark) !important;
}

.highcontrast .bg-yellow-4 {
  background: var(--puia-black);
}

.dark .bg-feed {
  opacity: 0.3;
}

.highcontrast .bg-feed {
  opacity: 0.5;
}

.theme-main-mint {
  background-color: var(--puia-purple-dark);
}

.dark .theme-main-mint {
  background-color: var(--puia-purple-darker) !important;
}

.dark .text-accent-1,
.dark .text-accent,
.dark .text-main-1,
.dark .text-main {
  color: var(--puia-white) !important;
}

.builder--research {
  max-width: unset !important;
}

.builder--research img {
  width: auto;
}

/* =====================================================
   BUILDER RESEARCH
   ===================================================== */

.builder--research .signature__title {
  line-height: 0.9;
}

/* =====================================================
   PARAGRAPH
   ===================================================== */

unistra-paragraph h1,
unistra-paragraph h2 {
  color: var(--puia-purple);
}

.dark unistra-paragraph h1,
.dark unistra-paragraph h2 {
  color: var(--puia-purple-light) !important;
}

.highcontrast unistra-paragraph h1,
.highcontrast unistra-paragraph h2 {
  color: var(--puia-white) !important;
}

unistra-paragraph blockquote {
  background-color: var(--puia-purple-bg);
}

.dark unistra-paragraph blockquote {
  background-color: var(--puia-purple-darker);
  border-color: var(--puia-purple-light);
}

/* =====================================================
   STATIC LIST
   ===================================================== */

.builder--static-list {
  background-color: var(--puia-yellow-bg);
}

.dark .builder--static-list {
  color: var(--puia-white);
  background-color: var(--puia-yellow-bg-dark);
}

/* =====================================================
   FEATURED ARTICLE
   ===================================================== */

.featured-article {
  padding-bottom: 2rem;
}

.bg-featured-article {
  color: var(--puia-white);
  background-color: var(--puia-purple-dark);
}

.dark .bg-featured-article {
  background-color: var(--puia-purple-darker);
}

/* =====================================================
   BUTTON OVERRIDES
   ===================================================== */

.btn {
  color: var(--black);
  background-color: var(--puia-fuchsia);
}

.btn:hover {
  background-color: var(--puia-fuchsia-hover);
}

.btn:focus {
  outline-color: var(--puia-fuchsia);
}

.btn:active {
  background-color: var(--puia-fuchsia-active);
}

.dark .btn {
  background-color: var(--puia-fuchsia-dark) !important;
}

.dark .btn:hover {
  background-color: var(--puia-fuchsia-dark-hover) !important;
}

.dark .btn:active {
  background-color: var(--puia-fuchsia-dark-active) !important;
}

/* stylelint-disable-next-line selector-max-compound-selectors */
.dark .btn.btn--icon-only.absolute {
  border-top: 1px solid var(--puia-white) !important;
  border-right: 1px solid var(--puia-white) !important;
  border-bottom: 1px solid var(--puia-white) !important;
  border-left: none !important;
}

/* Secondary variant */
.btn--secondary {
  color: var(--puia-fuchsia);
  background-color: var(--puia-white);
  box-shadow: inset 0px 0px 0px 1px var(--puia-fuchsia);
}

.btn--secondary:hover {
  color: var(--puia-black);
  background-color: var(--puia-fuchsia-hover);
}

.dark .btn--secondary {
  color: var(--puia-fuchsia-dark) !important;
  background-color: var(--puia-black) !important;
  box-shadow: inset 0px 0px 0px 1px var(--puia-fuchsia-dark) !important;
}

.dark .btn--secondary:hover {
  color: var(--puia-white) !important;
  background-color: var(--puia-fuchsia-dark-hover) !important;
}

/* Breadcrumb - pages événements */
.theme-main-blue unistra-breadcrumb a,
.theme-main-blue unistra-breadcrumb svg {
  color: var(--puia-white);
}

/* =====================================================
   ACCORDION
   ===================================================== */

unistra-accordion .accordion__icon--expanded {
  color: var(--puia-white);
  background-color: var(--puia-purple-light);
}

.dark unistra-accordion * {
  border-color: var(--puia-purple-light);
}

.dark unistra-accordion button:focus {
  outline-color: var(--puia-purple-light);
}

.dark .accordion__name,
.dark .accordion__icon {
  color: var(--puia-purple-light);
}

/* stylelint-disable-next-line selector-max-compound-selectors */
.dark unistra-accordion button:hover .accordion__icon {
  color: var(--puia-white);
  background-color: var(--puia-purple-light);
}

/* =====================================================
   PUSH CONTACT
   ===================================================== */

.push-contact * {
  color: var(--puia-white);
}

.push-contact .push-contact__card {
  background-color: var(--puia-purple-dark);
}

.push-contact .push-contact__image {
  height: 100%;
  max-height: unset;
}

.dark .push-contact .push-contact__card {
  background-color: var(--puia-purple-darker) !important;
}

.dark .push-contact .push-contact__image {
  opacity: 0.3;
}

.highcontrast.dark .push-contact .push-contact__card {
  background-color: var(--puia-purple-dark) !important;
}

/* =====================================================
   EVENTS FEATURED
   ===================================================== */

.events-featured {
  color: var(--puia-white);
}

.events-featured .tag--secondary {
  background-color: var(--puia-white);
}

.events-featured .event-card__infos,
.events-featured .event-card__infos * {
  background: transparent;
  border-color: var(--puia-white);
}

.events-featured .bg-white {
  color: var(--black);
}

.dark .events-featured .tag--secondary {
  background-color: var(--puia-black);
}

.highcontrast .events-featured .tag--secondary {
  background-color: var(--puia-black);
}

/* =====================================================
   EVENTS CROSSNAV
   ===================================================== */

.event-crossnav {
  background-color: var(--puia-yellow-bg);
}

.event-crossnav .event-card__link {
  background-color: var(--puia-yellow);
}

.dark .event-crossnav .event-card__link {
  color: var(--puia-purple-light) !important;
  background-color: var(--puia-yellow-dark) !important;
}

.event-crossnav unistra-event-card:hover,
.event-crossnav unistra-event-card:hover * {
  border-color: var(--puia-fuchsia) !important;
}

.event-crossnav unistra-event-card:hover .event-card__link {
  background-color: var(--puia-fuchsia) !important;
}

/* stylelint-disable selector-max-compound-selectors */
.dark .event-crossnav unistra-event-card:hover,
.dark .event-crossnav unistra-event-card:hover * {
  border-color: var(--puia-fuchsia-dark) !important;
}

.dark .event-crossnav unistra-event-card:hover .event-card__link {
  color: var(--puia-white) !important;
  background-color: var(--puia-fuchsia-dark) !important;
}
/* stylelint-enable selector-max-compound-selectors */

/* =====================================================
   FILES LIST
   ===================================================== */

/* stylelint-disable selector-max-compound-selectors */
.files-list .download-btn__link .btn.btn--icon-only {
  background-color: var(--puia-yellow);
}

.highcontrast .download-btn__link .btn.btn--icon-only,
.highcontrast.dark .download-btn__link .btn.btn--icon-only {
  background-color: var(--puia-yellow) !important;
}

.dark .files-list .download-btn__link .btn.btn--icon-only {
  background-color: var(--puia-yellow-dark) !important;
}
/* stylelint-enable selector-max-compound-selectors */

/* =====================================================
   FORMULAIRE
   ===================================================== */

.unistra-form {
  background-color: var(--puia-purple-bg);
}

.dark .unistra-form,
.highcontrast .unistra-form {
  background-color: var(--puia-purple-form-dark);
}

.dark .unistra-form h2 {
  color: var(--puia-white) !important;
}

/* =====================================================
   HIGHLIGHT
   ===================================================== */

unistra-highlight unistra-paragraph h1,
unistra-highlight unistra-paragraph h2 {
  color: var(--puia-black);
}

.unistra-highlight {
  background-color: var(--puia-purple-bg);
}

unistra-highlight.default {
  background-color: var(--puia-fuchsia-bg);
  border-color: var(--puia-fuchsia);
}

unistra-highlight.default .highlight__icon {
  color: var(--puia-black);
  background-color: var(--puia-fuchsia);
}

.dark unistra-highlight.default {
  background-color: var(--puia-fuchsia-bg-dark);
  border-color: var(--puia-fuchsia-dark);
}

.dark unistra-highlight.default .highlight__icon {
  color: var(--puia-true-black);
  background-color: var(--puia-fuchsia-dark);
}

/* stylelint-disable selector-max-compound-selectors */
.dark unistra-highlight unistra-paragraph h1,
.dark unistra-highlight unistra-paragraph h2 {
  color: var(--puia-white) !important;
}
/* stylelint-enable selector-max-compound-selectors */

.highcontrast unistra-highlight.default,
.highcontrast.dark unistra-highlight.default {
  background-color: var(--puia-fuchsia-bg);
  border-color: var(--puia-fuchsia);
}

.highcontrast unistra-highlight.default .highlight__icon,
.highcontrast.dark unistra-highlight.default .highlight__icon {
  color: var(--puia-black);
  background-color: var(--puia-fuchsia);
}

/* stylelint-disable selector-max-compound-selectors */
.highcontrast unistra-highlight unistra-paragraph,
.highcontrast.dark unistra-highlight unistra-paragraph,
.highcontrast.dark unistra-highlight unistra-paragraph h1,
.highcontrast.dark unistra-highlight unistra-paragraph h2 {
  color: var(--puia-black) !important;
}
/* stylelint-enable selector-max-compound-selectors */

/* =====================================================
   NUMBER KEYS
   ===================================================== */

.builder--number-keys {
  background-color: var(--puia-yellow-bg);
}

.builder--number-keys a {
  color: var(--puia-purple);
}

.dark .builder--number-keys,
.highcontrast .builder--number-keys {
  background-color: var(--puia-black) !important;
}

.dark .builder--number-keys a {
  color: var(--puia-purple-light) !important;
}

.highcontrast .builder--number-keys a {
  color: var(--puia-yellow-highcontrast) !important;
}

/* =====================================================
   CROSSNAV
   ===================================================== */

/* stylelint-disable selector-max-compound-selectors, selector-class-pattern */
.card-crossnav .card-page:hover {
  background-color: var(--puia-purple-dark);
  border-color: var(--puia-purple-dark);
}

.card-crossnav .card-page:hover .group-hover\/card\:bg-main-3 {
  background-color: var(--puia-purple);
}

.dark .card-crossnav .card-page {
  background-color: var(--puia-black);
}

.dark .card-crossnav .bg-card {
  opacity: 0.3;
}

.dark .card-crossnav .card-page:hover {
  color: var(--puia-white);
  background-color: var(--puia-purple-darker);
  border-color: var(--puia-purple-darker);
}

.dark .card-crossnav .card-page:hover .group-hover\/card\:bg-main-3 {
  background-color: var(--puia-purple-light);
}

.highcontrast .card-crossnav .card-page:hover,
.dark.highcontrast .card-crossnav .card-page:hover {
  color: var(--puia-white);
  background-color: var(--puia-purple-light);
  border-color: var(--puia-purple-light);
}

.highcontrast .card-crossnav .card-page:hover .group-hover\/card\:bg-main-3,
.dark.highcontrast .card-crossnav .card-page:hover .group-hover\/card\:bg-main-3 {
  background-color: var(--puia-yellow-highcontrast);
}
/* stylelint-enable selector-max-compound-selectors, selector-class-pattern */

/* =====================================================
   BIG CARDS
   ===================================================== */

/* stylelint-disable selector-max-compound-selectors, selector-class-pattern */
.meta-builder-big-cards .big-cards__card:hover {
  background-color: var(--puia-purple-dark);
  border-color: var(--puia-purple-dark);
}

.meta-builder-big-cards .big-cards__card:hover .group-hover\/card\:bg-main-3 {
  background-color: var(--puia-purple);
}

.dark .meta-builder-big-cards .big-cards__card {
  background-color: var(--puia-black);
}

.dark .big-cards__card .bg-card {
  opacity: 0.3;
}

.dark .meta-builder-big-cards .big-cards__card:hover {
  color: var(--puia-white);
  background-color: var(--puia-purple-darker);
  border-color: var(--puia-purple-darker);
}

.dark .meta-builder-big-cards .big-cards__card:hover .group-hover\/card\:bg-main-3 {
  background-color: var(--puia-purple-light);
}

.highcontrast .meta-builder-big-cards .big-cards__card:hover,
.dark.highcontrast .meta-builder-big-cards .big-cards__card:hover {
  color: var(--puia-white);
  background-color: var(--puia-purple-light);
  border-color: var(--puia-purple-light);
}

.highcontrast .meta-builder-big-cards .big-cards__card:hover .group-hover\/card\:bg-main-3,
.dark.highcontrast .meta-builder-big-cards .big-cards__card:hover .group-hover\/card\:bg-main-3 {
  background-color: var(--puia-yellow-highcontrast);
}
/* stylelint-enable selector-max-compound-selectors, selector-class-pattern */

/* =====================================================
   PROFILE CARDS
   ===================================================== */

/* stylelint-disable selector-max-compound-selectors, selector-class-pattern */
.builder--profile-cards .group\/card:hover {
  background-color: var(--puia-yellow-hover) !important;
  border-color: var(--puia-yellow-hover) !important;
}

.builder--profile-cards svg {
  color: var(--puia-yellow-hover) !important;
}

.builder--profile-cards .group\/card:hover svg {
  color: var(--puia-purple) !important;
}

.builder--profile-cards .group\/card:focus-within {
  background-color: var(--puia-yellow-hover) !important;
  border-color: var(--puia-yellow-hover) !important;
}

.builder--profile-cards .group\/card:active {
  background-color: var(--puia-yellow-active) !important;
}

.builder--profile-cards .group\/card:hover .group-hover\/card\:bg-main-3 {
  background-color: var(--puia-yellow) !important;
  border-color: var(--puia-white) !important;
}

.builder--profile-cards .group\/card:focus-within .group-focus-within\/card\:bg-main-3 {
  background-color: var(--puia-yellow) !important;
  border-color: var(--puia-white) !important;
}

.builder--profile-cards .group\/card:hover .card-icon {
  color: var(--puia-purple) !important;
}

.builder--profile-cards .group\/card:focus-within .card-icon {
  color: var(--puia-purple) !important;
}

.dark .builder--profile-cards .group\/card:hover {
  color: var(--puia-white) !important;
  background-color: var(--puia-yellow-dark-hover) !important;
  border-color: var(--puia-yellow-dark-hover) !important;
}

.dark .builder--profile-cards svg {
  color: var(--puia-yellow-dark-hover) !important;
}

.dark .builder--profile-cards .group\/card:hover svg {
  color: var(--puia-purple-light) !important;
}

.dark .builder--profile-cards .group\/card:focus-within {
  background-color: var(--puia-yellow-dark-hover) !important;
  border-color: var(--puia-yellow-dark-hover) !important;
}

.dark .builder--profile-cards .group\/card:active {
  background-color: var(--puia-yellow-dark-active) !important;
}

.dark .builder--profile-cards .group\/card:hover .group-hover\/card\:bg-main-3 {
  background-color: var(--puia-yellow-dark) !important;
  border-color: var(--puia-black) !important;
}

.dark .builder--profile-cards .group\/card:focus-within .group-focus-within\/card\:bg-main-3 {
  background-color: var(--puia-yellow-dark) !important;
  border-color: var(--puia-black) !important;
}

.dark .builder--profile-cards .group\/card:hover .card-icon {
  color: var(--puia-purple-light) !important;
}

.dark .builder--profile-cards .group\/card:focus-within .card-icon {
  color: var(--puia-purple-light) !important;
}
/* stylelint-enable selector-max-compound-selectors, selector-class-pattern */

/* =====================================================
   PORTRAITS
   ===================================================== */

/* stylelint-disable selector-max-compound-selectors */
.builder--portraits > .bg-main-1.theme-main-gold {
  background-color: var(--puia-purple-dark) !important;
}

@media (min-width: 1024px) {
  .builder--portraits .grid > div:first-child {
    color: var(--puia-white) !important;
  }

  .builder--portraits .grid > div:first-child .text-grey-4 {
    color: var(--puia-white) !important;
    opacity: 0.8;
  }
}
/* stylelint-enable selector-max-compound-selectors */

/* =====================================================
   UNISTRA-CARD
   ===================================================== */

unistra-card:hover {
  background-color: var(--puia-fuchsia);
}

unistra-card:active {
  background-color: var(--puia-fuchsia-hover);
}

.dark unistra-card:hover {
  background-color: var(--puia-fuchsia-dark);
}

.dark unistra-card:active {
  background-color: var(--puia-fuchsia-dark-hover);
}

/* =====================================================
   SIGNATURE
   ===================================================== */

@media screen and (max-width: 768px) {
  unistra-signature:not(.logo-signature) .signature__main,
  unistra-signature:not(.logo-signature) .signature__suffix {
    font-size: 16px !important;
    white-space: nowrap !important;
  }

  .builder--research unistra-signature .signature__main,
  .builder--research unistra-signature .signature__separator,
  .builder--research unistra-signature .signature__suffix {
    font-size: 9.5px !important;
  }
}

.builder--research p {
  font-size: var(--font-size-6);
}

.builder--research unistra-signature .signature__main:first-child {
  border-left: 1px solid var(--puia-black);
}

.builder--research unistra-signature .signature__main,
.builder--research unistra-signature .signature__suffix {
  padding-top: 8px;
  padding-bottom: 8px;
  border-top-color: var(--puia-black);
  border-right-color: var(--puia-black);
  border-bottom-color: var(--puia-black);
}

.builder--research unistra-signature .signature__separator {
  padding: 8px 0 8px 8px;
  border-top: 1px solid var(--puia-black);
  border-right: 0;
  border-bottom: 1px solid var(--puia-black);
  border-left: 0;
}

.builder--research unistra-signature .signature__separator::before,
.builder--research unistra-signature .signature__separator::after {
  display: none;
}

@media screen and (min-width: 768px) {
  .builder--research p {
    font-size: var(--font-size-9);
  }

  .builder--research unistra-signature .signature__main,
  .builder--research unistra-signature .signature__separator,
  .builder--research unistra-signature .signature__suffix {
    font-size: 18px;
  }
}
