/*  
Theme Name:     WE GO COOP v0.4.0
Description:    WE GO COOP wordpress theme
Author:         Matteo Prati
Version:        0.4.0
*/

/*-----------------------------------------------------------------
GLOBAL
-----------------------------------------------------------------*/ 

:root {
    --color-default: hsl(0, 0%, 99%);
    --color-muted: hsl(0, 0%, 96%);
    --color-primary: #f9b515;
    --color-secondary: #084291;
    --color-tertiary: #b2ce32;
    --color-accent: #0059d3;
    --color-accent-hover: #01419a;
    --color-accent-active: #0059d3;
    
    --color-category-1: #0B4780;
    --color-category-2: #AB3C3C;
    --color-category-3: #C15E21;
    --color-category-4: #1C354D;
    --color-category-5: #5FAD61;
    --color-category-6: #43AACC;
    --color-category-7: #8F8F8F;
    --color-category-8: #696289;
    --color-category-9: #868B59;
}

.uk-label {
    font-size:12px;
}

.label-multiple,
.label-other {
    background-color: var(--color-accent);
}

.label-aquifer {
    background-color: var(--color-category-1);
}

.label-bay {
    background-color: var(--color-category-2);
}

.label-coast {
    background-color: var(--color-category-3);
}

.label-delta {
    background-color: var(--color-category-4);
}

.label-lake {
    background-color: var(--color-category-5);
}

.label-marine-areas {
    background-color: var(--color-category-6);
}

.label-peatlands {
    background-color: var(--color-category-7);
}

.label-river {
    background-color: var(--color-category-8);
}

.label-wetlands {
    background-color: var(--color-category-9);
}


.acf-google-map .canvas > div {
    background-image: url('./images/fake-map.png') !important;
    background-size: cover;
}

/*
    Colors
-----------------------------------------*/

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

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

.light-green-bg {
    background-color:#ffe780; !important;
}

/*
    Typography
-----------------------------------------*/

.uk-link,a {
    color: var(--color-accent);
}

.uk-link-toggle:focus .uk-link,.uk-link-toggle:hover .uk-link,.uk-link:hover,a:hover {
    color: var(--color-accent-hover);
}

.uk-link-heading a:hover,.uk-link-toggle:focus .uk-link-heading,.uk-link-toggle:hover .uk-link-heading,a.uk-link-heading:hover {
    color: var(--color-accent);
}

/*
    Blocks
-----------------------------------------*/

.section-padding-large {
    padding: 140px 0;
}

/*
    Scrollbar
-----------------------------------------*/

/* width */
::-webkit-scrollbar {
  width: 7px;
  height: 7px;
}

/* Track */
::-webkit-scrollbar-track {
  background: #f1f1f1; 
}
 
/* Handle */
::-webkit-scrollbar-thumb {
  background: var(--color-accent); 
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: var(--color-accent-hover); 
}

@media only screen and (max-width: 639px) {
    ::-webkit-scrollbar {
      width: 3px;
      height: 3px;
    }    
}


/*
    Pagination
-----------------------------------------*/

.pagination a {
    color: #888888;
    font-weight: 400;
    text-decoration: none;
}

.accent-bg .pagination a {
    color:#222;
}

.pagination .page-numbers {
    margin:0 5px;
    padding:5px;
}

.pagination .page-numbers.current {
    color:#1e4ea1;
    font-weight: 700;
}

.pagination .page-numbers.current:after {
    content:"";
    display:inline-block;
    width:5px;
    height:5px;
    border-radius:50%;
    margin-bottom:-14px;
    margin-left:-7px;
    background-color:#1e4ea1;
}

/*
    Button
-----------------------------------------*/

.uk-button-primary {
    background-color: var(--color-accent);
}

.uk-button-primary:focus,.uk-button-primary:hover {
    background-color: var(--color-accent-hover);
}

.uk-button-primary.uk-active,.uk-button-primary:active {
    background-color: var(--color-accent-active);
}


@media only screen and (max-width: 639px) {
    .uk-button {padding:0px 15px;}    
}

/*
    Modal
-----------------------------------------*/

.modal-section {
    border-bottom: 1px solid #e5e5e5;
    padding: 15px 30px;
}

.uk-modal-page .screen-reader-text, .screen-reader-text span, .ui-helper-hidden-accessible {
    border: 0;
    clip: rect(1px,1px,1px,1px);
    -webkit-clip-path: inset(50%);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    word-wrap: normal!important;
}

@media only screen and (max-width: 639px) {
    .uk-modal {padding: 25px 5px;}
    .uk-modal-body {padding:10px;}
    /*acf-form*/
    .uk-modal-body .acf-field {font-size:12px;}
    .uk-modal-body .acf-google-map .canvas,
    .uk-modal-body .acf-field .leaflet-map {height: 250px !important;}
}

/*
    Components
-----------------------------------------*/

.uk-badge {
    background: var(--color-accent);
}

/*-----------------------------------------------------------------
HEADER NAVBAR
-----------------------------------------------------------------*/

.uk-navbar-container:not(.uk-navbar-transparent) {
    background-color: rgba(255, 255, 255, 0.9);
    border-bottom: 1px solid #e5e5e5;
    backdrop-filter: blur(6px);
}

.uk-navbar .uk-navbar-nav>li.current-menu-item>a {
    color:var( --color-secondary);
    font-weight: 700;
}


/*-----------------------------------------------------------------
OFFCANVAS NAVBAR
-----------------------------------------------------------------*/

.uk-offcanvas-bar .uk-close {
    color:#333;
}

.uk-offcanvas-bar.uk-dark hr {
    border-top-color:rgba(0,0,0,.2);
}

.uk-offcanvas-bar.uk-dark .uk-nav-primary>li>a {
    color:#999;   
}

.uk-offcanvas-bar.uk-dark .uk-nav-primary>li.current-menu-item>a {
    color:var( --color-secondary);
}

.uk-offcanvas-bar.uk-dark {
    background-color: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(6px);
}

.uk-offcanvas-bar.uk-dark .social-nav a {
    color:#333;
}

.uk-offcanvas-bar.uk-dark .uk-icon-button {
    background-color: #d9d9d9;
    color:#333;
    margin-bottom:10px;
}

/*-----------------------------------------------------------------
PAGE-GPT
-----------------------------------------------------------------*/

.map-buttons {
    transform: translateY(calc(-100% - 24px));
    text-align: center;
}

.map-button {
    background-color: #fff; 
    box-shadow: rgba(0, 0, 0, 0.3) 0px 1px 4px -1px;  
}

.map-button:hover {
    background-color: #f9f9f9;
}


/*-----------------------------------------------------------------
404
-----------------------------------------------------------------*/

.fourofour h1 {
    font-size:15rem;
    font-weight: 800;
    color:#f0f0f0;
}

.fourofour h2 {
    font-size:1em;
}

@media only screen and (max-width: 639px) {
    .fourofour h1 {font-size:7.5rem;}
    .fourofour h2 {font-size:0.75em;}
    .fourofour .main-logo img {width:146px;}
}

/*-----------------------------------------------------------------
OPENSTREET MAP PLUGIN
-----------------------------------------------------------------*/

.acf-osm-above .leaflet-control-geocoder {
    border:1px solid #cbd0d4;
    border-radius: 0;
}

.acf-osm-above .leaflet-control-geocoder>.leaflet-control-geocoder-form input {
    padding: 5px 10px !important;
    font-size: 14px !important;
    font-weight: inherit !important;
}

.acf-osm-above .leaflet-control-geocoder>.leaflet-control-geocoder-form input:focus {
    background: none;
}

.acf-osm-above .leaflet-control-geocoder>.leaflet-control-geocoder-icon,
.leaflet-control-geocoder-icon {
    border-radius: 0 !important;
}

.acf-field-open-street-map .leaflet-control-geocoder-alternatives {
    font-size:14px;
    width:auto;
    max-width: 100%;
}


.acf-field-open-street-map .leaflet-map {
    border:1px solid #cbd0d4;
    border-radius: 0;   
    border-top: none;
}

.acf-field-open-street-map .markers-instruction {
    margin-top:3px;
    width:calc(100% - 18px);
    padding:5px 10px;
    background-color:#f2efe9;
    font-size:14px;
    color:#000;
}

.acf-field-open-street-map .osm-marker {
    padding: 10px 0 !important;
}


.acf-field-open-street-map .osm-markers .input input {
    outline:none;
    border:1px solid #cbd0d4;
    border-radius:0;
    font-size: 14px !important;
}


/*-----------------------------------------------------------------
USER REGISTRATION FORM PLUGIN
-----------------------------------------------------------------*/

#user-registration, 
.user-registration {
    background-color: transparent;
    font-size:14px;
}

.ur-frontend-form {
    border:none;
}

/*.user-registration-Input,
.input-text.ur-frontend-field {
    border: 1px solid #e5e5e5;
}*/

.user-registration label {
    font-size: 14px !important;
    font-weight: 700 !important;
}

#user-registration.horizontal .user-registration-MyAccount-navigation ul {
    border-bottom: none;
}

#user-registration.horizontal .user-registration-MyAccount-navigation ul::before {
    left:0;
}

#user-registration .user-registration-MyAccount-navigation ul .user-registration-MyAccount-navigation-link a {
    font-family: inherit;
}

#user-registration.horizontal .user-registration-MyAccount-navigation ul .user-registration-MyAccount-navigation-link a {
    padding: 15px 20px;
}
#user-registration .user-registration-MyAccount-navigation ul .user-registration-MyAccount-navigation-link a {
    font-family: inherit;
    font-size:12px;
}

#user-registration.horizontal .user-registration-MyAccount-navigation ul .user-registration-MyAccount-navigation-link.is-active a {
    background-color: inherit;
    border-bottom-width: 2px;
}

.ur-frontend-form .ur-form-row .ur-form-grid select {
        background-image: url("data:image/svg+xml;charset=UTF-8,%3Csvg%20width%3D%2224%22%20height%3D%2216%22%20viewBox%3D%220%200%2024%2016%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%0A%20%20%20%20%3Cpolygon%20fill%3D%22%23666%22%20points%3D%2212%201%209%206%2015%206%22%20%2F%3E%0A%20%20%20%20%3Cpolygon%20fill%3D%22%23666%22%20points%3D%2212%2013%209%208%2015%208%22%20%2F%3E%0A%3C%2Fsvg%3E%0A");

}

#ur-recaptcha-node {
    margin-top:40px;
    margin-bottom:30px;
}


/*-----------------------------------------------------------------
IVORY SEARCH PLUGIN
-----------------------------------------------------------------*/

div.is-ajax-search-details, div.is-ajax-search-result {
    padding:2px !important;
}