/* Dark mode overrides */
@media (prefers-color-scheme: dark) {
  :root {
    --background-color: #121212;
    --foreground-color: #e0e0e0;
    --surface-color: #1e1e1e;
    --primary-color: #FF7E2A;
    --border-color: #333333;
  }
  body {
    background-color: var(--background-color) !important;
    color: var(--foreground-color) !important;
  }
  .header, .footer, .modal-content, .panelContent {
    background-color: var(--surface-color) !important;
    color: var(--foreground-color) !important;
  }
  .footer h1 {
    border-bottom: 1px solid #588fa3;
    font-family: 'source_sans_probold';
    width: 100%;
    color: #ffffff;
  }
  a, .btn-link {
    color: var(--primary-color) !important;
  }
  .header .menu li a.btnLogin {
    border: 1px solid #588fa3;
    padding: 0 15px;
    height: 30px;
    border-radius: 30px;
    background-color: #4e7f90;
    color: #ffffff !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45);
  }
  .firstSection .square {
    border: 1px solid #588fa3;
    background-color: rgba(0, 0, 0, 0.5);
    -webkit-backdrop-filter: blur(18px) saturate(140%);
    backdrop-filter: blur(18px) saturate(140%);
    box-shadow: 0 20px 50px rgba(0, 0, 0, 0.35),
      inset 0 1px 0 rgba(255, 255, 255, 0.12);
  }
  .firstSection .square p {
    color: rgba(235, 245, 248, 0.92);
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.55);
  }
  .firstSection .square strong {
    color: #9bcbdc;
  }
  .btn, button {
    background-color: var(--surface-color) !important;
    color: var(--foreground-color) !important;
    border-color: var(--border-color) !important;
  }
  input, select, textarea, .form-control {
    background-color: #2c2c2c !important;
    color: var(--foreground-color) !important;
    border: 1px solid var(--border-color) !important;
  }
  input:focus,
  select:focus,
  textarea:focus,
  .form-control:focus {
    border: 2px solid #4d91a8 !important;
    box-shadow: 0 0 0 3px rgba(77, 145, 168, 0.36), 0 8px 16px rgba(45, 108, 130, 0.22) !important;
    outline: none !important;
  }

  .participationPage .footer,
  .participationPage .footer.active {
    background: #161d21 !important;
    background-color: #161d21 !important;
    border-top-color: #2a3940 !important;
    box-shadow: 0 -8px 22px rgba(0, 0, 0, 0.38);
  }

  .participationPage .footer .logo .logoLight {
    display: none !important;
  }

  .participationPage .footer .logo .logoDark {
    display: block !important;
    height: 28px !important;
    max-width: 210px !important;
    opacity: 0.95;
    width: auto !important;
  }

  .participationPage .footer .lblHelp,
  .participationPage .footer .btnLanguage {
    color: #d7e6eb !important;
  }

  .participationPage .footer .lblSplitter {
    color: #6f8790 !important;
  }

  .participationPage .reservationStep h1,
  .participationPage .participationStepHeader h1,
  .participationPage .profilePhotoTitle {
    color: #edf8fb !important;
  }

  .participationPage .reservationStep p,
  .participationPage .participationStepHeader p {
    color: #cbdce2 !important;
  }

  .participationPage .reservationField label,
  .participationPage .reservationSignature label {
    color: #ffffff !important;
  }

  .participationPage .reservationConsentItem,
  .participationPage .reservationConsentItem span {
    color: #ffffff !important;
  }

  .participationPage .reservationConsentItem input[type="checkbox"]:not(:checked) + span {
    opacity: 0.7;
  }

  .participationPage .reservationConsentItem input[type="checkbox"]:checked + span {
    opacity: 1;
  }

  .participationPage .reservationPasswordSecurityNote .fa,
  .participationPage .reservationPasswordFormArea .passwordVisibility {
    color: #9bcbdc !important;
  }

  .participationPage .reservationCredentialLabel,
  .participationPage .reservationPasswordFieldLabel {
    color: #ffffff !important;
  }

  .participationPage .reservationCredentialValue {
    background: #30363a !important;
    border-color: #444c51 !important;
    color: rgba(190, 197, 201, 0.8) !important;
  }

  .participationPage .reservationPasswordFormArea .reservationPasswordInputWrap input:not([type='checkbox']) {
    background: #153846 !important;
    border-color: #42616b !important;
    color: #edf8fb !important;
  }

  .participationPage .reservationIntroContent .reservationPrimaryButton {
    max-width: 360px;
    min-width: 0;
    padding-left: 34px !important;
    padding-right: 34px !important;
    white-space: nowrap;
    width: calc(100% - 14px) !important;
  }

  .participationPage .reservationActions {
    background: #151c20 !important;
    background-color: #151c20 !important;
    border-top-color: #263940 !important;
  }

  .participationPage .photoSourceOverlay {
    background: rgba(0, 0, 0, 0.66) !important;
  }

  .participationPage .profilePhotoHelpOverlay {
    background: rgba(0, 0, 0, 0.66) !important;
  }

  .participationPage .photoSourceChoice {
    background: #172126 !important;
    border-color: #35515b !important;
    box-shadow: 0 18px 38px rgba(0, 0, 0, 0.55) !important;
    color: #edf8fb !important;
  }

  .participationPage .profilePhotoHelpDialog {
    background: #172126 !important;
    border-color: #35515b !important;
    box-shadow: 0 18px 38px rgba(0, 0, 0, 0.55) !important;
    color: #edf8fb !important;
  }

  .participationPage .profilePhotoHelpIcon {
    background: #22343c !important;
    color: #9bcbdc !important;
  }

  .participationPage .photoSourceText {
    color: #edf8fb !important;
  }

  .participationPage .profilePhotoHelpText strong {
    color: #edf8fb !important;
  }

  .participationPage .profilePhotoHelpBody {
    color: #cbdce2 !important;
  }

  .participationPage .photoSourceText span,
  .participationPage .photoCameraStatus {
    color: #cbdce2 !important;
  }

  .participationPage .photoSourceChoice .reservationSecondaryButton {
    background: linear-gradient(to bottom, #24343b 0%, #1b282e 100%) !important;
    border-color: #42616b !important;
    color: #edf8fb !important;
  }

  .participationPage .photoSourceChoice .reservationBackTextButton {
    color: #a9c4cd !important;
  }

  .participationPage .photoCameraViewport {
    border: 1px solid #35515b !important;
  }

  .participationPage .photoCameraError {
    color: #ffb2b2 !important;
  }

  .participationPage .reservationPrimaryButton {
    background: linear-gradient(to bottom, #7cafc0 0%, #4d91a8 45%, #2e748c 100%) !important;
    border-color: transparent !important;
    color: #ffffff !important;
  }

  .participationPage .eventPhotographerFooter {
    background: #151c20 !important;
    background-color: #151c20 !important;
    border-top-color: #263940 !important;
    box-shadow: none !important;
  }

  .participationPage .eventPhotographerIdentity {
    color: #ffffff !important;
    text-shadow: 0 1px 2px rgba(0,0,0,0.36);
  }

  .participationPage .eventPhotographerRole {
    color: rgba(255, 255, 255, 0.84) !important;
  }

  .participationPage .reservationSlots .reservationActions {
    padding-bottom: 8px !important;
    padding-top: 8px !important;
  }

  .participationPage .reservationSlotList {
    border-bottom-color: #263940 !important;
  }

  .participationPage .reservationSlot {
    background: linear-gradient(to bottom, #22323a 0%, #18252b 100%) !important;
    border-color: #3b5660 !important;
    box-shadow: 0 7px 14px rgba(0, 0, 0, 0.28) !important;
    color: #edf8fb !important;
  }

  .participationPage .reservationSlotStatus small {
    color: #aac2ca !important;
  }

  .participationPage .reservationSlot.selected {
    background: linear-gradient(to bottom, #3f859b 0%, #28697d 100%) !important;
    border-color: #77c1d6 !important;
    color: #ffffff !important;
    box-shadow: 0 8px 16px rgba(26, 110, 138, 0.28), inset 0 0 0 1px rgba(255,255,255,0.12) !important;
  }

  .participationPage .reservationSlot.selected .reservationSlotStatus small {
    color: #dff7ff !important;
  }

  .participationPage .reservationSlot.full {
    background: linear-gradient(to bottom, #262d31 0%, #1f262a 100%) !important;
    border-color: #39464c !important;
    color: #9fb0b7 !important;
  }

  .participationPage .reservationSlots .reservationActions.single .reservationPrimaryButton {
    max-width: 270px !important;
    min-width: 0;
    padding-left: 46px !important;
    padding-right: 46px !important;
    width: 270px !important;
  }

  .sidebar {
    background: linear-gradient(to bottom, rgba(48, 48, 48,1) 16%,rgba(0,0,0,1) 86%);
    border-image: linear-gradient(to bottom, rgba(32, 32, 32, 1), rgba(48, 48, 48, 1)) 1 100%;
    box-shadow: none;
  }

  .sidebar .logo img {
    filter: grayscale(100%) invert(100%);
  -webkit-filter: grayscale(100%) invert(100%); /* Safari */
  opacity: 0.8;

  }

  .main {
  background-image: url('../guest/images/paperBG_dark.jpg');
  background-repeat: repeat-y;
  min-height: 100vh;
  height: 100%;
  padding: 30px 15px 15px 15px;
}

.overlayColorCorner {
  opacity: 0.5;
}

.sidebar .sections .menuItem.selected {
  background-color: #353d41;
}

.sidebar .sections .menuItem:hover {
  background-color: #506169;
  color: #ffffff;
  cursor: pointer;
}

.sidebar .nbEvents span {
  background-color: #494b53;
  color: #90a7b3;
}

.accountSection .accountInfos td:last-child {
  color: #588fa3;
}

.sidebar .profile img {
  border: 2px solid #2f373b !important;
}

.accountSection > .thumbnailContainer .thumbnailContent {
  border-color: #2f373b !important;
  background-color: #1b2023 !important;
  padding: 4px;
}

.listEvents .eventItem .thumbnailContent {
  border: 1px solid #4e7380;
  background-color: #2b2c2c;
}

.listEvents .eventItem:hover {
  background-color: #142228 !important;
}

.listPhotos .photoItem:hover {
  background-color: #142228 !important;
}

.eventGroupSelector .groupSelectorCard {
  background: linear-gradient(180deg, #1b2a31 0%, #162228 100%) !important;
  border: 1px solid rgba(130, 174, 190, 0.24) !important;
  color: #82aebe !important;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.22);
}

.eventGroupSelector .groupSelectorCard:hover,
.eventGroupSelector .groupSelectorCard:focus {
  background: #142228 !important;
  border-color: rgba(130, 174, 190, 0.42) !important;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.28);
}

.eventGroupSelector .groupSelectorThumb {
  background-color: #23343b !important;
}

.dropdown-menu.dropdown-menu-left,
.infosHeader .actions .dropdown-menu,
.infosHeader .bottom ul.dropdown-menu {
  background-color: #142228 !important;
  border: 1px solid rgba(173, 205, 214, 0.32) !important;
  box-shadow: 0 10px 22px rgba(0, 0, 0, 0.35);
}

.dropdown-menu.dropdown-menu-left > li,
.infosHeader .actions .dropdown-menu > li,
.infosHeader .bottom ul.dropdown-menu > li,
.dropdown-menu.dropdown-menu-left > li > a,
.infosHeader .actions .dropdown-menu > li > a,
.infosHeader .bottom ul.dropdown-menu > li > a {
  background-color: transparent !important;
}

.dropdown-menu.dropdown-menu-left > li > a:hover,
.dropdown-menu.dropdown-menu-left > li > a:focus,
.infosHeader .actions .dropdown-menu > li > a:hover,
.infosHeader .actions .dropdown-menu > li > a:focus,
.infosHeader .bottom ul.dropdown-menu > li > a:hover,
.infosHeader .bottom ul.dropdown-menu > li > a:focus {
  background-color: rgba(130, 174, 190, 0.12) !important;
  color: #82aebe !important;
}

.dropdown-menu .divider,
.infosHeader .actions .dropdown-menu .divider,
.infosHeader .bottom ul.dropdown-menu .divider {
  background-color: rgba(173, 205, 214, 0.18) !important;
  border-top: 1px solid rgba(173, 205, 214, 0.24) !important;
}














* Glow separator plus visible en dark mode */
  .photographer-glow-separator {
    background: radial-gradient(ellipse at center, 
      rgba(81, 133, 150, 0.8) 0%, 
      rgba(81, 133, 150, 0.5) 30%,
      transparent 70%);
    opacity: 0.8;
  }
  
  /* Boutons gardent leurs couleurs vives en dark mode */
  .btn-photographer-swiftui {
    color: white !important;
    text-shadow: 0 2px 4px rgba(0, 0, 0, 0.6) !important;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.5);
  }
  
  .btn-photographer-swiftui:hover {
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.6);
  }
  
  .btn-photographer-swiftui i {
    color: white !important;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.6));
  }
  
  /* Les gradients des boutons restent identiques en dark mode */
  .btn-photographer-problem-swiftui {
    background: linear-gradient(to bottom, 
      rgb(189, 20, 20),
      rgb(224, 143, 143),
      rgb(223, 32, 32)
    ) !important;
  }
  
  .btn-photographer-thanks-swiftui {
    background: linear-gradient(to bottom,
      rgb(150, 187, 190),
      rgb(81, 133, 150),
      rgb(81, 133, 150),
      rgb(61, 100, 112)
    ) !important;
  }
  
  /* Modales en dark mode */
  .modal-content {
    background-color: #1e1e1e !important;
    color: #e0e0e0 !important;
  }
  
  .modal-header {
    background-color: #2c2c2c !important;
    border-bottom: 1px solid #333333 !important;
  }
  
  .modal-footer {
    background-color: #2c2c2c !important;
    border-top: 1px solid #333333 !important;
  }
  
  .modal-title {
    color: #e0e0e0 !important;
  }

  .popupInstructions .popupContainer {
    background-color: #1b2023 !important;
    color: #e0e0e0 !important;
    border: 1px solid #334149;
    box-shadow: 0 12px 30px rgba(0, 0, 0, 0.65);
  }

  .popupInstructions .popupContainer .content,
  .popupInstructions .popupContainer .content div,
  .popupInstructions .popupContainer .details,
  .popupInstructions .popupContainer p {
    color: #d6dde0 !important;
  }

  .popupInstructions .popupContainer h1 {
    color: #9fc7d5 !important;
  }

  .popupInstructions .popupContainer a {
    color: #FF7E2A !important;
  }

  .popupInstructions .popupContainer .quotaNote {
    background: rgba(255, 126, 42, 0.12) !important;
    border: 1px solid rgba(255, 126, 42, 0.35) !important;
    color: #ffd4b7 !important;
  }

  .popupInstructions .popupContainer .footer {
    background: linear-gradient(to bottom, #6a98ab 0%, #4e7889 100%) !important;
    color: #ffffff !important;
    border-top: 1px solid #3b5a66 !important;
    text-shadow: none !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12);
  }

  .popupInstructions .popupContainer .footer:hover {
    background: linear-gradient(to bottom, #7aa9bc 0%, #5b8799 100%) !important;
    color: #ffffff !important;
  }
  
  /* Options de messages en dark mode */
  .photographer-modal-option {
    background: #2c2c2c !important;
    border: 2px solid #444444 !important;
    color: #e0e0e0 !important;
  }
  
  .photographer-modal-option:hover {
    background: #353535 !important;
    border-color: #555555 !important;
  }
  
  .photographer-modal-option.selected {
    background: linear-gradient(to bottom, 
      rgb(150, 187, 190),
      rgb(81, 133, 150),
      rgb(61, 100, 112)
    ) !important;
    color: white !important;
    border-color: rgb(61, 100, 112) !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.4);
  }
  
  .photographer-modal-option.selected.problem {
    background: linear-gradient(to bottom, 
      rgb(189, 20, 20),
      rgb(224, 143, 143),
      rgb(223, 32, 32)
    ) !important;
    border-color: rgb(189, 20, 20) !important;
  }
  
  /* Textarea en dark mode */
  .photographer-custom-textarea {
    background: #2c2c2c !important;
    border: 2px solid #444444 !important;
    color: #e0e0e0 !important;
  }
  
  .photographer-custom-textarea:focus {
    border-color: #588fa3 !important;
    box-shadow: 0 0 0 0.2rem rgba(88, 143, 163, 0.25) !important;
  }
  
  .photographer-custom-textarea::placeholder {
    color: #888888 !important;
  }
  
  /* Textes et éléments de la modale */
  .text-muted {
    color: #aaaaaa !important;
  }
  
  .modal-body p {
    color: #cccccc !important;
  }

  #frmLogin .bg-danger {
    background-color: #2c2c2c !important;
    color: #e0e0e0 !important;
    border: 1px solid #333333 !important;
    border-radius: 4px;
  }

  #frmLogin .modal-content {
    background: rgba(22, 30, 34, 0.96) !important;
    border: 1px solid #334149 !important;
    box-shadow: 0 22px 60px rgba(0, 0, 0, 0.58) !important;
    color: #e6eef2 !important;
  }

  #frmLogin .modal-header,
  #frmLogin .modal-footer {
    background: transparent !important;
    border: 0 !important;
  }

  #frmLogin .modal-title {
    color: #ffffff !important;
  }

  #frmLogin .modal-header::before {
    border-color: rgba(255, 126, 42, 0.32);
    background: rgba(255, 126, 42, 0.12);
    color: #FF7E2A;
  }

  #frmLogin .instructions,
  #frmLogin .control-label,
  #frmLogin .checkbox {
    color: #c9d7dc !important;
  }

  #frmLogin .btnForgotPasswordInline {
    color: #FF7E2A !important;
  }

  #frmLogin .form-control,
  #frmLogin .input-group-addon {
    background: rgba(255, 255, 255, 0.07) !important;
    border-color: #405761 !important;
    color: #f3f8fa !important;
  }

  #frmLogin .form-control::placeholder {
    color: #9eafb6 !important;
  }

  #frmLogin .loginAppleDivider div {
    background: #405761 !important;
  }

  #frmLogin .loginAppleDivider span {
    color: #b9c8ce !important;
  }

  #frmLogin .btnAppleSignIn {
    background: rgba(255, 255, 255, 0.08) !important;
    border-color: #588fa3 !important;
    color: #ffffff !important;
  }

  #frmLogin .btnAppleSignIn:hover,
  #frmLogin .btnAppleSignIn:focus {
    background: rgba(88, 143, 163, 0.24) !important;
    color: #ffffff !important;
  }

  #frmLogin .appleSignInEventContext {
    background: rgba(88, 143, 163, 0.14) !important;
    border-color: rgba(88, 143, 163, 0.42) !important;
    color: #dbe9ee !important;
  }
  
  /* Boutons de la modale en dark mode */
  .modal-footer .btn-default {
    background-color: #2c2c2c !important;
    color: #e0e0e0 !important;
    border-color: #444444 !important;
  }
  
  .modal-footer .btn-default:hover {
    background-color: #353535 !important;
    border-color: #555555 !important;
  }
  
  .modal-footer .btn-primary {
    background-color: #588fa3 !important;
    border-color: #588fa3 !important;
    color: white !important;
  }
  
  .modal-footer .btn-primary:hover {
    background-color: #4a7b8d !important;
    border-color: #4a7b8d !important;
  }
  
  .modal-footer .btn-danger {
    background-color: #c62828 !important;
    border-color: #c62828 !important;
  }
  
  .modal-footer .btn-danger:hover {
    background-color: #b71c1c !important;
    border-color: #b71c1c !important;
  }

  body.validationPage {
    background: #182127 !important;
    background-image: none !important;
    color: #e6eef2 !important;
  }

  .validationPage .container,
  .validationPage .panelMain,
  .validationPage .panelContent,
  .validationPage .formContainer,
  .validationPage .resultPanel {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
  }

  .validationPage .header,
  .validationPage .header.active {
    background: linear-gradient(to bottom, #496e7e 0%, #2f4f5d 100%) !important;
    border-bottom: 1px solid #203640 !important;
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.42) !important;
    color: #f4f8fa !important;
  }

  .validationPage .header .eventTitle {
    color: #f6fbfd !important;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.35);
  }

  .validationPage .header .eventPlace {
    color: #cfe1e8 !important;
    letter-spacing: 1.5px;
  }

  .validationPage .validationCard,
  .validationPage .validationResultCard {
    background: #182127 !important;
    border: 1px solid rgba(118, 160, 176, 0.24) !important;
    box-shadow: 0 24px 56px rgba(0, 0, 0, 0.42) !important;
  }

  .validationPage .validationEyebrow {
    color: #ffbf70 !important;
  }

  .validationPage .validationIntro h1,
  .validationPage .finalTitle,
  .validationPage .thankYouInstructions {
    color: #eff8fb !important;
  }

  .validationPage .validationIntroText,
  .validationPage .validationIntroText p,
  .validationPage .finalContent,
  .validationPage .finalContent p,
  .validationPage .thankYouNotes,
  .validationPage .thankYouNotes p {
    color: #d8e4e9 !important;
  }

  .validationPage .accountDetails .profilePhotoContainer {
    background: linear-gradient(to bottom, #486877 0%, #31515f 100%) !important;
    box-shadow: 0 16px 32px rgba(0, 0, 0, 0.28) !important;
  }

  .validationPage .accountDetails .profilePhotoContainer .btnChangePhoto {
    background-color: rgba(8, 17, 23, 0.42) !important;
    color: #f5f9fb !important;
  }

  .validationPage .panelMain input,
  .validationPage input.form-control,
  .validationPage .input-group-addon {
    background-color: #162027 !important;
    color: #e8f0f4 !important;
    border-color: #314854 !important;
  }

  .validationPage .panelMain input::placeholder {
    color: #90aab4 !important;
  }

  .validationPage .input-group-addon i {
    color: #d9e7ed !important;
  }

  .validationPage .validationErrors {
    color: #ffadad !important;
    background: rgba(126, 30, 30, 0.18);
    border: 1px solid rgba(189, 93, 93, 0.28);
    border-radius: 12px;
    padding: 12px 14px;
  }

  .validationPage .validationErrors ul,
  .validationPage .validationErrors ul li,
  .validationPage .validationErrors .instructions {
    color: #ffd1d1 !important;
  }

  .validationPage .buttonsContainer .btnNext a {
    color: #ffbf70 !important;
  }

  .validationPage .buttonsContainer .btnNext a:hover {
    color: #ffd49a !important;
  }

  .validationPage .lnkAccount a,
  .validationPage .popupInstructions .popupContainer .footer {
    background: linear-gradient(to bottom, #f0b15d 0%, #cf7a24 100%) !important;
    border: 1px solid #a35f1c !important;
    color: #ffffff !important;
    text-shadow: 0 1px 1px rgba(86, 47, 11, 0.45) !important;
    box-shadow: 0 14px 28px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;
  }

  .validationPage .lnkAccount a:hover,
  .validationPage .popupInstructions .popupContainer .footer:hover {
    background: linear-gradient(to bottom, #f6be74 0%, #db892f 100%) !important;
    color: #ffffff !important;
  }

  .validationPage .resultButtonRow button {
    background: linear-gradient(to bottom, #74b6cf 0%, #4f93ae 100%) !important;
    border: 1px solid #356f88 !important;
    color: #ffffff !important;
    text-shadow: 0 1px 1px rgba(23, 58, 73, 0.45) !important;
    box-shadow: 0 18px 34px rgba(0, 0, 0, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.16) !important;
  }

  .validationPage .resultButtonRow button:hover {
    background: linear-gradient(to bottom, #68acc6 0%, #4587a2 100%) !important;
    color: #ffffff !important;
  }

  .validationPage .popupInstructions .popupContainer,
  .validationPage .popupInstructions .popupContainer .content,
  .validationPage .popupInstructions .popupContainer .details,
  .validationPage .popupInstructions .popupContainer p {
    color: #dbe6eb !important;
  }

  .validationPage .popupInstructions .popupContainer h1 {
    color: #eef8fb !important;
  }

  .validationPage .popupInstructions .popupContainer a {
    color: #ffbf70 !important;
  }

  .validationPage .footer,
  .validationPage .footer.active {
    background: linear-gradient(to bottom, #1a2328 0%, #11181d 100%) !important;
    border-top: 1px solid #273942 !important;
    box-shadow: 0 -10px 24px rgba(0, 0, 0, 0.35) !important;
  }

  .validationPage .footer .logo .logoLight {
    display: none !important;
  }

  .validationPage .footer .logo .logoDark {
    display: block !important;
    width: auto !important;
    height: 28px !important;
    max-width: 210px !important;
  }

  .validationPage .footer .lblHelp {
    color: #d6e3e8 !important;
    font-size: 14px !important;
    line-height: 1 !important;
    opacity: 0.8;
  }

  .validationPage .footer .btnLanguage {
    display: inline-block !important;
    background: transparent !important;
    border: 0 !important;
    padding: 0 !important;
    -webkit-appearance: none !important;
    appearance: none !important;
    font-size: 14px !important;
    line-height: 1 !important;
    color: #d6e3e8 !important;
  }

  .validationPage .footer .lblSplitter {
    color: #6d8791 !important;
  }

  .validationPage .footer .lblHelp:hover,
  .validationPage .footer .btnLanguage:hover {
    color: #ffbf70 !important;
    opacity: 1;
  }

  .validationPage .tooltip.help {
    background-color: #1a242a !important;
    box-shadow: 0 10px 22px rgba(0, 0, 0, 0.38) !important;
  }

  .validationPage .tooltip::after {
    border-color: #1a242a transparent transparent transparent !important;
  }

  .validationPage .tooltip .title {
    color: #f4f8fa !important;
  }

  .validationPage .tooltip .message {
    color: #d7e3e8 !important;
  }



}