/*!
 * VO-KA parametri pitne vode — prenos sloga iz modula Drupal 7.
 *
 * OBSEG: vsak selektor v tej datoteki je omejen na ovoj `.voka-parametri`
 * (glej `templates/parametri.php`). V Drupalu je bil slog gol — razredi kot
 * `.loader`, `.water-link`, `.st0`…`.st29`, `.meje`, `.obmocja-active`,
 * `.dataTables_*` in celo gola elementna pravila `path, polygon` so veljali za
 * CELO stran. Tam to ni motilo, ker je iste razrede lastovala ista tema; v
 * WordPressu pa slog pušča v temo naročnika. Najbolj škodljivo je bilo pravilo
 * `path, polygon { pointer-events: none }`, ki je onemogočilo klik na vsak SVG
 * na strani — v testni temi na primer na gumb za odpiranje menija.
 *
 * ZAKAJ `:where()` IN NE NAVADNE PREDPONE
 * ---------------------------------------
 * `:where()` ne prispeva specifičnosti. `:where(.voka-parametri) .loader` ima
 * torej natanko enako specifičnost kot izvirni `.loader` — kaskada proti temi,
 * proti priloženim slogom DataTables in proti `voka-parametri-base.css` ostane
 * nespremenjena do zadnjega pravila. Z navadno predpono (`.voka-parametri .loader`)
 * bi vsako pravilo pridobilo en razred specifičnosti in bi začelo zmagovati tam,
 * kjer je prej izgubilo (npr. proti `voka-parametri-base.css` pri `.water-link` in
 * proti `@media (max-width: 767px)` iz `jquery.dataTables.min.css`). Cilj je
 * izolacija, ne redizajn, zato je edina prava izbira predpona brez specifičnosti.
 * (`:where()` podpirajo Chrome 88+, Firefox 78+, Safari 14+; datoteka
 * `voka-parametri-base.css` tako ali tako že zahteva sodoben brskalnik.)
 *
 * IZJEMA: `path, polygon` (gola elementna selektorja)
 * ---------------------------------------------------
 * Sam ovoj tu ne zadošča: znotraj ovoja je poleg zemljevida še graf, ki ga riše
 * `assets/js/voka-chart.js` in je prav tako SVG. Pravilo je zato zoženo na
 * `:where(.voka-parametri #obmocja)` — velja samo za zemljevid oskrbovalnih
 * območij, tako kot je bilo mišljeno. Ker je `#obmocja` znotraj `:where()`,
 * ostane specifičnost `0-0-0-1`, torej enaka kot prej; `path.area-water`
 * (`0-0-1-1`) pravilo še naprej prehiti in območja ostanejo klikljiva.
 *
 * Vsebina pravil (barve, velikosti, robovi) je nedotaknjena — spremenjeni so
 * samo selektorji. Izvirnik brez omejitve je ohranjen v
 * `voka_parametri_vode/css/voka_parametri.css` (izvorna koda D7, samo branje).
 */

:where(.voka-parametri) #parameters,
:where(.voka-parametri) #parameters-2 {
  width: 100% !important;
  max-width: 100% !important;
}

:where(.voka-parametri) #parameters-results,
:where(.voka-parametri) #parameters-results-all {
  clear: both;
  margin: 40px 0 80px;
}

:where(.voka-parametri) #parameters2 td, :where(.voka-parametri) #parameters2 th {
  min-width: 120px;
}

:where(.voka-parametri) #parameter-chart {
  margin-bottom: 40px;
}

:where(.voka-parametri) .dataTables_info,
:where(.voka-parametri) .dataTables_paginate,
:where(.voka-parametri) .dataTables_length,
:where(.voka-parametri) #parameters_filter {
  float: left;
  font-size: 14px;
  font-family: 'aktiv-grotesk', sans-serif;
  color: #979797;
}

:where(.voka-parametri) .dataTables_paginate {
  padding-top: 0.755em !important;
}

:where(.voka-parametri) .dataTables_paginate,
:where(.voka-parametri) #parameters_filter {
  float: right;
}

:where(.voka-parametri) .dataTables_length,
:where(.voka-parametri) #parameters_filter {
  margin: 18px 0;
}

:where(.voka-parametri) .dataTables_paginate,
:where(.voka-parametri) .dataTables_paginate a {
  font-size: 14px;
  font-family: 'aktiv-grotesk', sans-serif;
  color: #007ac3;
  font-weight: 500;
  padding: 0 4px;
}

:where(.voka-parametri) .dataTables_paginate a {
  cursor: pointer;
}

:where(.voka-parametri) #parameters_filter {
  position: relative;
}

:where(.voka-parametri) #parameters_filter input {
  min-width: 260px;
  border: 1px solid #007ac3;
  padding: .9375rem;
  padding-right: 0;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-family: aktiv-grotesk, sans-serif;
  font-size: .8125rem;
  line-height: .8125rem;
  min-height: .8125rem;
  font-weight: 400;
  color: #979797;
  outline: 0;
  -webkit-appearance: none;
}

:where(.voka-parametri) #parameters_filter label:after {
  content: '';
  position: absolute;
  top: 10px;
  right: 12px;
  width: 25px;
  height: 25px;
  background: url(../img/icon_search_blue_voka.png) no-repeat;
}

:where(.voka-parametri) #parameters_length select {
  border: 1px solid #007ac3;
  color: #979797;
  font-family: aktiv-grotesk, sans-serif;
  font-size: .8125rem;
  line-height: .8125rem;
  min-height: .8125rem;
  font-weight: 400;
  padding: .9375rem .4rem;
}

:where(.voka-parametri) #water-area {
  border: 1px solid #007ac3;
  color: #979797;
  font-family: aktiv-grotesk, sans-serif;
  font-size: .8125rem;
  line-height: .8125rem;
  min-height: .8125rem;
  font-weight: 400;
  padding: .9375rem .4rem;
}

:where(.voka-parametri) #Layer_4 text,
:where(.voka-parametri) #Layer_4 tspan {
  color: #686868;
  font-family: aktiv-grotesk, sans-serif;
  font-size: .8125rem;
  font-weight: 400;
}

/* .area-klece:hover  {
  opacity: 1;
  stroke:#E28820 ;
  stroke-width: 1;
}
.area-klece-brest:hover  {
  opacity: 1;
  stroke:#027E7D  ;
  stroke-width: 1;
}
.area-rakitna:hover {
  opacity: 1;
  stroke:#0621A6 ;
  stroke-width: 1;
}
.area-pijava-gorica:hover {
  opacity: 1;
  stroke:#0621A6 ;
  stroke-width: 1;
}
.area-klece-hrastje-jarski:hover {
  opacity: 1;
  stroke:#009F4C ;
  stroke-width: 1;
}
.area-jarski-prod:hover {
  opacity: 1;
  stroke:#F44143 ;
  stroke-width: 1;
}
.area-smarna-gora:hover {
  opacity: 1;
  stroke:#0621A6 ;
  stroke-width: 1;
}
.area-lipoglav:hover {
  opacity: 1;
  stroke:#009F4C ;
  stroke-width: 1;
}
.area-klece-hrastje-brest:hover {
  opacity: 1;
  stroke:#FB4D88 ;
  stroke-width: 1;
}
.area-zelimlje:hover {
  opacity: 1;
  stroke:#A72CCF ;
  stroke-width: 1;
}
.area-ravno-brdo:hover {
  opacity: 1;
  stroke:#0621A6 ;
  stroke-width: 1;
}
.area-brest:hover {
  opacity: 1;
  stroke:#A72CCF ;
  stroke-width: 1;
}
.area-sentvid:hover {
  opacity: 1;
  stroke:#0083B7 ;
  stroke-width: 1;
}
.area-hrastje-jarski:hover {
  opacity: 1;
  stroke:#0083B7 ;
  stroke-width: 1;
}
.area-lipoglav:hover {
  opacity: 1;
  stroke:#009F4C ;
  stroke-width: 1;
}
.area-trebeljevo:hover {
  opacity: 1;
  stroke:#B88306 ;
  stroke-width: 1;
}
.area-klece-jarski:hover {
  opacity: 1;
  stroke: #C19E1D;
  stroke-width: 1;
}
.area-medvode:hover {
  opacity: 1;
  stroke: #EB754E;
  stroke-width: 1;
} */

:where(.voka-parametri) .area-klece,
:where(.voka-parametri) .area-klece-brest,
:where(.voka-parametri) .area-rakitna,
:where(.voka-parametri) .area-pijava-gorica,
:where(.voka-parametri) .area-klece-hrastje-jarski,
:where(.voka-parametri) .area-jarski-prod,
:where(.voka-parametri) .area-smarna-gora,
:where(.voka-parametri) .area-lipoglav,
:where(.voka-parametri) .area-klece-hrastje-brest,
:where(.voka-parametri) .area-zelimlje,
:where(.voka-parametri) .area-ravno-brdo,
:where(.voka-parametri) .area-brest,
:where(.voka-parametri) .area-sentvid,
:where(.voka-parametri) .area-hrastje-jarski,
:where(.voka-parametri) .area-lipoglav,
:where(.voka-parametri) .area-trebeljevo,
:where(.voka-parametri) .area-klece-txt,
:where(.voka-parametri) .area-klece-brest-txt,
:where(.voka-parametri) .area-rakitna-txt,
:where(.voka-parametri) .area-pijava-gorica-txt,
:where(.voka-parametri) .area-klece-hrastje-jarski-txt,
:where(.voka-parametri) .area-jarski-prod-txt,
:where(.voka-parametri) .area-smarna-gora-txt,
:where(.voka-parametri) .area-lipoglav-txt,
:where(.voka-parametri) .area-klece-hrastje-brest-txt,
:where(.voka-parametri) .area-zelimlje-txt,
:where(.voka-parametri) .area-ravno-brdo-txt,
:where(.voka-parametri) .area-brest-txt,
:where(.voka-parametri) .area-sentvid-txt,
:where(.voka-parametri) .area-hrastje-jarski-txt,
:where(.voka-parametri) .area-lipoglav-txt,
:where(.voka-parametri) .area-trebeljevo-txt,
:where(.voka-parametri) .area-mali-vrh-txt,
:where(.voka-parametri) .area-orle-txt,
:where(.voka-parametri) .area-klece-jarski-txt,
:where(.voka-parametri) .area-medvode,
:where(.voka-parametri) .area-belo,
:where(.voka-parametri) .area-zlebe,
:where(.voka-parametri) .area-studencice,
:where(.voka-parametri) .area-topol,
:where(.voka-parametri) .area-osolnik,
:where(.voka-parametri) .area-trnovec {
  cursor: pointer;
  transition: opacity 0.2s linear,
  fill 0.2s linear;
}

:where(.voka-parametri #obmocja) path, :where(.voka-parametri #obmocja) polygon {
  pointer-events: none;
}

:where(.voka-parametri) path.area-water,
:where(.voka-parametri) polygon.area-water {
  pointer-events: all;
  opacity: .7;
  transition: opacity .2s ease-in-out,
  fill 0.2s linear;
}

:where(.voka-parametri) path.area-water:hover,
:where(.voka-parametri) polygon.area-water:hover {
  opacity: 1;
}

:where(.voka-parametri) .st0 {
  /*opacity: 0.57;*/
  opacity: 1;
}

/* .area-klece {
  opacity: 1;
  fill: #F6B76E;
}

.area-klece-brest {
  opacity: 0.8;
  fill: #56C9C8;
}

.area-rakitna {
  opacity: 0.8;
  fill: #3C59E5;
}

.area-pijava-gorica {
  opacity: 0.8;
  fill: #3C59E5;
}

.area-klece-hrastje-jarski {
  opacity: 0.8;
  fill: #2DD27C;
}

.area-jarski-prod {
  opacity: 0.8;
  fill: #FF9899;
}

.area-smarna-gora {
  opacity: 0.8;
  fill: #1C3EB7;
}

.area-lipoglav {
  opacity: 0.8;
  fill: #2DD27C;
}

.area-klece-hrastje-brest {
  opacity: 0.8;
  fill: #FE94B8;
}

.area-zelimlje {
  opacity: 0.8;
  fill: #BE91CC;
}

.area-ravno-brdo {
  opacity: 0.8;
  fill: #3C59E5;
}

.area-brest {
  opacity: 0.8;
  fill: #D89EEB;
}

.st13 {
  opacity: 0.71;
}

.area-trebeljevo {
  opacity: 0.8;
  fill: #CBAB60;
}

.st15 {
  fill: #FBB998;
}

.st16 {
   opacity: 0.8;
  fill: #007AC2;

}

.area-sentvid {
  opacity: 1;
  fill: #64D3FF;
}

.area-hrastje-jarski {
  opacity: 0.8;
  fill: #64D3FF;
}
/**/
:where(.voka-parametri) .area-klece-jarski {
  opacity: 0.8;
  fill: #FFF0BA;
}

:where(.voka-parametri) .area-medvode {
  opacity: .55;
  fill: #EB754E;
}

/*
 * OPOMBA (WordPress): tu je v izvirniku za zaklepajem stal osamljen zaključek
 * komentarja. Ta je pokvaril naslednji selektor — brskalnik je pravilo `.st19`
 * zavrgel (preverjeno z izpisom `document.styleSheets`: med razčlenjenimi
 * pravili ga ni). Osamljeni zaključek smo odstranili, da je datoteka veljavna,
 * pravilo pa pustili zakomentirano, da se izpis prav nič ne spremeni. Razreda
 * `st19` predloga `templates/parametri.php` tako ali tako nima.
 *
 *   .st19 { clip-path: url(#SVGID_2_); }
 */

:where(.voka-parametri) .st20 {
  opacity: 0.7;
  fill: none;
  stroke: #000000;
  stroke-width: 0.4191;
  stroke-linejoin: round;
  stroke-miterlimit: 10;
}

:where(.voka-parametri) .st21 {
  opacity: 0.7;
  fill: #82D3F1;
  pointer-events: none
}

:where(.voka-parametri) .st22 {
  opacity: 0.7;
  fill: none;
  stroke: #416DB4;
  stroke-width: 0.2096;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-miterlimit: 10;
}

:where(.voka-parametri) .st23 {
  opacity: 0.7;
  fill: #82D3F1;
  stroke: #416DB4;
  stroke-width: 0.2096;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-miterlimit: 10;
  pointer-events: none;
}

:where(.voka-parametri) .st24 {
  opacity: 0.7;
  fill: none;
  stroke: #DDD8D0;
  stroke-width: 1.2378;
  stroke-linecap: round;
  stroke-linejoin: round;
  stroke-miterlimit: 10;
}

:where(.voka-parametri) .st24:hover {
  opacity: 1;
}

:where(.voka-parametri) .st25 {
  fill: #686868;
  font-size: 10px;
  font-family: 'AktivGrotesk-Medium';
}

:where(.voka-parametri) .st26 {}

:where(.voka-parametri) .st27 {}

:where(.voka-parametri) .st28 {
  fill: #107ABF;
  opacity: 0.9;
}

:where(.voka-parametri) .st28:hover {
  opacity: 1;
}

:where(.voka-parametri) .st29 {
  opacity: 0.8;
}

:where(.voka-parametri) .st29:hover {
  opacity: 1;
}

:where(.voka-parametri) .st27 {
  opacity: 0.8;
}

:where(.voka-parametri) .st27:hover {
  opacity: 1;
}

:where(.voka-parametri) .meje {
  pointer-events: none;
}

:where(.voka-parametri) .water-link {
  display: inline-block;
  margin-top: 20px;
  color: #bcbcbc;
  text-decoration: none;
  border-bottom: 1px solid #bcbcbc;
  font-family: aktiv-grotesk, sans-serif;
  font-size: 15px;
  padding-bottom: 2px;
  font-weight: 400;
}

:where(.voka-parametri) #area,
:where(.voka-parametri) .loader {
  display: none;
}

:where(.voka-parametri) .loader {
  text-align: center;
  font-family: aktiv-grotesk, sans-serif;
  font-size: 15px;
  color: #979797;
  font-weight: 400;
  margin: 1rem 0;
}

:where(.voka-parametri) .loader img {
  position: relative;
  top: 6px;
}

:where(.voka-parametri) .obmocja-inactive {
  display: none !important;
}

:where(.voka-parametri) .obmocja-active {
  display: block !important;
}

:where(.voka-parametri) #submit-area {
  /* outline: none; */
}

:where(.voka-parametri) #parameters_paginate .current {
  font-weight: 600;
}

@media (max-width: 500px) {
  :where(.voka-parametri) .dataTables_info,
  :where(.voka-parametri) .dataTables_paginate,
  :where(.voka-parametri) .dataTables_length,
  :where(.voka-parametri) #parameters_filter {
    float: left;
    font-size: 14px;
    font-family: 'aktiv-grotesk', sans-serif;
    color: #979797;
  }
  :where(.voka-parametri) .dataTables_paginate,
  :where(.voka-parametri) #parameters_filter {
    margin: 15px 0 20px;
    float: left;
    margin-left: 0;
    padding-left: 0;
  }
  :where(.voka-parametri) .dataTables_paginate .previous {
    padding: 0;
  }
}
