/* *************************************************************************** */
/* Zmienne */
/* *************************************************************************** */

body.a11y-contrast {
  --a11y-bg: #000;
  --a11y-surface: #000;
  --a11y-text: #fff;
  --a11y-link: #ffff00;
  --a11y-border: #fff;
  --a11y-focus: #00ffff;
  --a11y-kafle: #222;
  --a11y-hover: #333;

  /* Theme tokens (see web/themes/custom/radix_starterkit/src/scss/_variables.scss).
     Redefining these here - instead of hand-patching every component that
     already reads var(--ip-*) below - makes those components re-color
     automatically, for free, without a dedicated rule per selector.
     Skipped on purpose: --ip-panel/--ip-white/--ip-black - each is used for
     more than one role in the theme (e.g. --ip-white as both a light
     background AND light text-on-dark-image), so a single blanket value
     would fix one usage while breaking the other. Those stay as explicit
     per-component overrides below until the underlying tokens are split. */
  --ip-accent: var(--a11y-link);
  --ip-accent-nolink: var(--a11y-border);
  --ip-accent-dark: #cccc00;
  --ip-text: var(--a11y-text);
  --ip-text-secondary: var(--a11y-text);
  --ip-form-description-color: var(--a11y-text);
  --ip-border: var(--a11y-border);
  --ip-border-hover: var(--a11y-border);
  --ip-surface-muted: var(--a11y-kafle);
  --ip-content-panel: var(--a11y-kafle);
  --ip-placeholder-bg: var(--a11y-kafle);
  --ip-action-hover: var(--a11y-hover);
  --ip-block-shadow: none;
  --ip-shadow-hover: none;
  --ip-shadow-color: transparent;
  --ip-action-focus: var(--a11y-focus);
  --ip-panel: var(--a11y-bg);
  --ip-base: var(--a11y-text);

  background-color: var(--a11y-bg);
  color: var(--a11y-text);
}

/* *************************************************************************** */
/* Toolbar z Pomarańczowy -> Czarny */
/* *************************************************************************** */

body.a11y-contrast .page .page__toolbar {
  background-color: var(--a11y-bg) !important;
  color: var(--a11y-text) !important;
}

/* *************************************************************************** */
/* Stylizowanie ikon dostępności w trybie kontrastu
/* *************************************************************************** */

/* Ustawienie ich tła na czarno */
body.a11y-contrast .page__toolbar .accessibility-control__button {
  background-color: var(--a11y-surface) !important;
  color: var(--a11y-link) !important;
  border-color: var(--a11y-border) !important;
}

/* Ikony svg na żółto*/
body.a11y-contrast .accessibility-control__button img, body.a11y-contrast .toolbar-account-toggle, body.a11y-contrast .toolbar-account-toggle__icon {
  filter: brightness(0) saturate(100%)
          invert(89%)
          sepia(100%)
          saturate(3000%)
          hue-rotate(5deg)
          brightness(105%)
          contrast(105%) !important;
}

/* Ikony svg na żółto*/
body.a11y-contrast .accessibility-control__button img:hover,
body.a11y-contrast .toolbar-account-toggle:hover,
body.a11y-contrast .toolbar-account-toggle__icon:hover {
  filter: brightness(0) saturate(100%)
          invert(89%)
          sepia(100%)
          saturate(3000%)
          hue-rotate(95deg)
          brightness(105%)
          contrast(105%) !important;
}

/* Menu konta otwarte */
body.a11y-contrast .toolbar-account-toggle[aria-expanded="true"] {
    filter: brightness(0) saturate(100%)
          invert(89%)
          sepia(100%)
          saturate(3000%)
          hue-rotate(95deg)
          brightness(105%)
          contrast(105%) !important;
}


/* *************************************************************************** */
/* Tekst */
/* *************************************************************************** */
body.a11y-contrast,
body.a11y-contrast p,
body.a11y-contrast li,
body.a11y-contrast dt,
body.a11y-contrast dd,
body.a11y-contrast label,
body.a11y-contrast small,
body.a11y-contrast h1,
body.a11y-contrast h2,
body.a11y-contrast h3,
body.a11y-contrast h4,
body.a11y-contrast h5,
body.a11y-contrast h6,
body.a11y-contrast .text-muted {
  color: var(--a11y-text) !important;
}

/* *************************************************************************** */
/* Linki
/* *************************************************************************** */

body.a11y-contrast .page a {
  color: var(--a11y-link) !important;
}

body.a11y-contrast .page a:hover {
  color: var(--a11y-focus) !important;
}

/* *************************************************************************** */
/* Przyciski */
/* *************************************************************************** */

body.a11y-contrast .page .btn:hover{
  background-color: var(--a11y-hover) !important;
}

/* *************************************************************************** */
/* Tabele */
/* *************************************************************************** */

body.a11y-contrast .page table tbody tr td{
  background-color: var(--a11y-kafle);
  color: var(--a11y-text);
}

/* *************************************************************************** */
/* Footer */
/* *************************************************************************** */

/* Only the site footer - a bare `footer` also hit the <footer> of views
   (the "more" link row), painting a black strip inside gray panels. */
body.a11y-contrast .page .page__footer {
  background-color: var(--a11y-bg) !important;
}

/* *************************************************************************** */
/* Navbar */
/* *************************************************************************** */

/* *************************************************************************** */
/* Formularze, wyszukiwania */
/* *************************************************************************** */

body.a11y-contrast .form-control,
body.a11y-contrast .form-select,
body.a11y-contrast .form-check-input,
body.a11y-contrast textarea,
body.a11y-contrast input,
body.a11y-contrast select {
  background-color: var(--a11y-bg) !important;
  color: var(--a11y-text) !important;
  border: 2px solid var(--a11y-border) !important;
}

body.a11y-contrast input::placeholder,
body.a11y-contrast textarea::placeholder {
  color: var(--a11y-text) !important;
  opacity: 1;
}

body.a11y-contrast .form-control:focus,
body.a11y-contrast .form-select:focus,
body.a11y-contrast textarea:focus,
body.a11y-contrast input:focus {
  background-color: var(--a11y-bg) !important;
  color: var(--a11y-text) !important;
  border-color: var(--a11y-focus) !important;
  box-shadow: 0 0 0 0.25rem rgba(0, 255, 255, 0.35) !important;
}

body.a11y-contrast caption {
  color: var(--a11y-text);
}


/* *************************************************************************** */
/* Dropdown menu */
/* *************************************************************************** */

body.a11y-contrast .dropdown-menu {
  background-color: var(--a11y-surface) !important;
}

body.a11y-contrast .dropdown-item:hover,
body.a11y-contrast .dropdown-item:focus {
  background-color: var(--a11y-hover) !important;
}

body.a11y-contrast .dropdown-item.active,
body.a11y-contrast .dropdown-item.active {
  background-color: var(--a11y-hover) !important;
}

/* *************************************************************************** */
/* Focus klawiaturą */
/* *************************************************************************** */
body.a11y-contrast :focus-visible {
  outline: 4px solid var(--a11y-focus) !important;
  outline-offset: 4px !important;
}

/* *************************************************************************** */
/* Stronicowanie */
/* *************************************************************************** */

body.a11y-contrast .pagination .page-link {
  background-color: var(--a11y-kafle) !important;
  color: var(--a11y-link) !important;
  border-color: var(--a11y-link) !important;
}

/* Hover i focus */
body.a11y-contrast .pagination .page-link:hover,
body.a11y-contrast .pagination .page-link:focus {
  background-color: var(--a11y-link) !important;
  color: var(--a11y-bg) !important;
  border-color: var(--a11y-link) !important;
}

/* Aktywna strona */
body.a11y-contrast .pagination .page-item.active .page-link {
  background-color: var(--a11y-link) !important;
  color: var(--a11y-bg) !important;
  border-color: var(--a11y-link) !important;
}

/* "..." */
body.a11y-contrast .pagination .page-item.disabled .page-link {
  background-color: var(--a11y-kafle) !important;
  color: var(--a11y-text) !important;
  border-color: var(--a11y-border) !important;
}

/* Focus klawiaturą */
body.a11y-contrast .pagination .page-link:focus-visible {
  outline: 3px solid #00ffff !important;
  outline-offset: 2px !important;
  box-shadow: none !important;
}


/* *************************************************************************** */
/* Podstrona Pracownicy + podstrona z osobistym profilem pracownika */
/* *************************************************************************** */

/* Przyciemnienie horizontal-tabs-list */
body.a11y-contrast .horizontal-tabs-list{
  background-color: var(--a11y-bg);
}
body.a11y-contrast .horizontal-tab-button{
  background-color: var(--a11y-kafle);
}
body.a11y-contrast .horizontal-tab-button :hover{
  background-color: var(--a11y-hover);
}

/* Przyciemnienie kafli z pracownikami - tylko tło (border i tekst tytułu/
   stanowiska są już var(--ip-border)/var(--ip-accent)/var(--ip-text-
   secondary) w komponencie, więc podmiana tokenów powyżej wystarcza) */
body.a11y-contrast .views-col {
  background-color: var(--a11y-kafle) !important;
}

/* *************************************************************************** */
/* Podstrona O Instytucie */
/* *************************************************************************** */

/* Usunięcie białego tła z tekstu */
body.a11y-contrast p strong,
body.a11y-contrast p span {
  background-color: transparent !important;
  color: var(--a11y-text) !important;
}

/* body.a11y-contrast .navbar-toggler-icon{
  background-color: transparent;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255, 255, 255, 1)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
} */
body.a11y-contrast .navbar-toggler-icon {
  filter: brightness(0) saturate(100%) invert(94%) sepia(100%) saturate(7496%) hue-rotate(359deg) brightness(106%) contrast(110%);
}

/* *************************************************************************** */
/* Poprawa działania kontrastu dla zakładek */
/* *************************************************************************** */

body.a11y-contrast .nav-tabs .nav-item .active{
  background-color: var(--a11y-kafle) !important;
  color: var(--a11y-link);
}

body.a11y-contrast .nav-tabs .nav-item :hover{
  background-color: var(--a11y-hover) !important;
  color: var(--a11y-link);
}

/* .field__label nie wymaga już osobnej reguły - w komponencie ma
   color: var(--ip-text-secondary), podmienione w bloku ze zmiennymi. */

/* *************************************************************************** */
/* Scroll to top  */
/* *************************************************************************** */

body.a11y-contrast .page-fab-scrolltop {
  background-color: var(--a11y-surface) !important;
  color: var(--a11y-link) !important;
  border-color: var(--a11y-link) !important;
}

body.a11y-contrast .page-fab-scrolltop svg {
  color: var(--a11y-link) !important;
}

/* *************************************************************************** */
/* Copyright */
/* *************************************************************************** */

body.a11y-contrast .page__copyright{
  background-color: var(--a11y-bg);
  color: var(--a11y-text);
}

/* *************************************************************************** */
/* Stylizowanie konstrastu dla nowej strony głównej */
/* *************************************************************************** */

/* body.a11y-contrast .homepage-about {
  background-color: var(--a11y-bg);

  .block {
    background-color: var(--a11y-bg) !important;
  }
}

body.a11y-contrast .homepage-news {
  background-color: var(--a11y-bg);

  .block {
    background-color: var(--a11y-bg) !important;
  }

  .nav-item {
    a {
      background-color: var(--a11y-kafle) !important;
    }
  }
}

body.a11y-contrast .page__hero .page__hero-action {
  background-color: var(--a11y-kafle);
}

body.a11y-contrast .page__about-action {
  background-color: var(--a11y-kafle) !important;
}

body.a11y-contrast .more-link a {
  background-color: var(--a11y-kafle) !important;
} */

/* Zdjęcie w tle hero zastąpione jednolitym tłem (w tym warianty
   publikacje/seminaria/projekty, które mają własne zdjęcie + blur) */
body.a11y-contrast .page__hero .page__hero-media {
  background-image: none !important;
  filter: none !important;
  background-color: var(--a11y-bg) !important;
}

body.a11y-contrast .page__hero .page__hero-media::after {
  background: transparent !important;
}

body.a11y-contrast .page .block {
  background-color: var(--a11y-bg);
  border-color: var(--a11y-border) !important;
}

/* Views and teasers take the background of whatever holds them: black on
   the page, the gray panel (--ip-content-panel) inside blocks and list
   panels (front page news, person/team publications and projects) -
   a black box of their own inside a gray panel looked like a misaligned
   inset. */
body.a11y-contrast .page .view {
  background-color: transparent;
  border-color: var(--a11y-border) !important;
}

body.a11y-contrast .page .block .block__title {
  color: var(--a11y-text);
}

body.a11y-contrast .page .links.nav .nav-link a,
/* body.a11y-contrast .page .links.nav .nav-item span, */
body.a11y-contrast .page .horizontal-tabs-list a,
body.a11y-contrast .page .more-link a,
body.a11y-contrast .page .person-more-link,
body.a11y-contrast .page .action {
  background-color: var(--a11y-kafle) !important;
}

body.a11y-contrast .page .links.nav .nav-link a:hover,
/* body.a11y-contrast .page .links.nav .nav-item span:hover, */
body.a11y-contrast .page .horizontal-tabs-list a:hover,
body.a11y-contrast .page .more-link a:hover,
body.a11y-contrast .page .person-more-link:hover,
body.a11y-contrast .page .action:hover {
  background-color: var(--a11y-hover) !important;
  color: var(--a11y-focus) !important;
}


body.a11y-contrast .page .node--teaser {
  /* border-color pominięty - komponent ma border: var(--ip-border), już
     podmienione w bloku ze zmiennymi na górze pliku. */
  background-color: transparent;

  .node__media {
    background-color: transparent;
  }

  .links.nav .nav-item span {
    background-color: var(--a11y-kafle) !important;
  }

  .links.nav .nav-item span:hover {
    background-color: var(--a11y-hover) !important;
    color: var(--a11y-focus) !important;
  }
}


/* Sidebars of person and team pages: no decorative orange pattern, the
   same gray panel as the other boxes. */
body.a11y-contrast .node--iitis-person--full #person-sidebar,
body.a11y-contrast #group-sidebar {
  background-image: none;
  background-color: var(--ip-content-panel);
}