/**
    Theme Name: Vss
    Author: Valmieras novada pašvaldība
    Description: Vss customizations theme
    Version: 1.0.0
    Text Domain: vss
    Template: astra
*/
@font-face {
    font-family: 'Inter', sans-serif;
    font-weight: normal;
}

* {
    -webkit-tap-highlight-color:  rgba(255, 255, 255, 0);
    font-family: 'Inter', sans-serif;
    line-height: 1.3;
}

/* Hide the slider initially */
.event-slider, .gallery-slider, .news-slider, .partner-slider, .poster-slider, .quote-slider, .main-slider {
    visibility: hidden;
    opacity: 0;
}

/* Show only after Slick has fully initialized */
.main-slider.slick-initialized, .news-slider.slick-initialized, .event-slider.slick-initialized, .poster-slider.slick-initialized, .gallery-slider.slick-initialized, .partner-slider.slick-initialized, .quote-slider.slick-initialized {
    visibility: visible !important;
    opacity: 1 !important;
    transition: opacity 0.3s ease-in-out;
}

.ast-primary-header-bar .ast-site-title-wrap {
    display: none;
}

.ast-separate-container .ast-article-inner {
    background-color: var(--custom-color);
}

.site-header-primary-section-right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}

.ast-builder-grid-row {
    margin-top: 20px;
    margin-bottom: 20px;
}

.mega-menu-link .mega-indicator {
    display: none !important;
}

ul#mega-menu-secondary_menu > li:first-child {
    a:before {
        content: "" !important;
        display: inline-block !important; 
        width: 24px !important;
        height: 24px !important; 
        background-image: url(assets/icons/search.svg) !important;
        background-size: cover !important;
        background-repeat: no-repeat !important;
        margin-right: 8px !important; 
        margin-top: 8px !important;
    }
}

ul#mega-menu-secondary_menu > li:nth-child(2) {
    a:before {
        content: "" !important;
        display: inline-block !important; 
        width: 22px !important;
        height: 22px !important; 
        background-image: url(assets/icons/settings.svg) !important;
        background-size: cover !important;
        background-repeat: no-repeat !important;
        margin-right: 8px !important; 
        margin-top: 9px !important;
    }
}

ul#mega-menu-secondary_menu a:hover {
    background: none !important;
    color: #000 !important;
    text-decoration: underline !important;
}

#mega-menu-wrap-secondary_menu #mega-menu-secondary_menu > li.mega-menu-item.mega-toggle-on > a.mega-menu-link {
    background: none !important;
    color: #000 !important;
}

#mega-menu-wrap-secondary_menu #mega-menu-secondary_menu > li.mega-menu-item > a.mega-menu-link {
    padding: 0px 8px 0px 8px;
}

#mega-menu-wrap-secondary_menu #mega-menu-secondary_menu > li.mega-menu-item > a.mega-menu-link:focus {
    background: none !important;
    color: #000 !important;
}

#mega-menu-secondary_menu .mega-sub-menu {
    margin-top: 61px !important;
    background: white !important;
}

#sub-menu-inner-title {
    font-size: 40px;
    color: #000;
    margin-bottom: 40px;
}

#sub-menu-inner-sub-title {
    font-size: 20px;
    color:#000;
    margin-bottom: 36px;
}

input.search-submit {
    display: none;
}

.ast-search-submit {
    position: absolute;
    height: 100px;
    right: 2px;
    background: transparent !important;
    border: none !important;
    box-shadow: none;

    &::before {
        content: "" !important;
        display: inline-block !important; 
        width: 24px !important;
        height: 24px !important; 
        background-image: url(assets/icons/search.svg) !important;
        background-size: cover !important;
        background-repeat: no-repeat !important;
        margin-right: 8px !important; 
        margin-top: 9px !important;
    }

    &:hover {
        background: transparent;
    }

    i {
        display: none;
    }
}

input#search-field {
    width: 1120px;
    height: 100px;
    font-size: 28px;
    box-shadow: none !important;
    border-radius: 0 !important;
    padding-left: 32px;
}

.mega-sub-menu {
    padding: 40px 96px 64px 96px !important;

    .mega-menu-item {
        padding: 0 !important;
    }
}

#easy-read-content  {
    #easy-read {
        border: 1px solid #041F33;
        padding: 12px 16px 12px 16px;
        font-size: 20px;
        color: #041F33;

        &::before {
            content: none !important;
        }

        &:hover {
            background-color: #041F33 !important;
            color: white !important;
            text-decoration: none !important;
        }
    }
}

#font-size-content {
    #pct_100 {
        border: 1px solid #041F33;
        padding: 12px 16px 12px 16px;
        font-size: 20px;
        color: #041F33;
        margin-right: 8px;

        &:hover {
            background-color: #041F33 !important;
            color: white !important;
            text-decoration: none !important;
            cursor: pointer;
        }
    }

    #pct_150 {
        border: 1px solid #041F33;
        padding: 12px 16px 12px 16px;
        font-size: 20px;
        color: #041F33;
        margin-right: 8px;

        &:hover {
            background-color: #041F33 !important;
            color: white !important;
            text-decoration: none !important;
            cursor: pointer;
        }
    }

    #pct_200 {
        border: 1px solid #041F33;
        padding: 12px 16px 12px 16px;
        font-size: 20px;
        color: #041F33;

        &:hover {
            background-color: #041F33 !important;
            color: white !important;
            text-decoration: none !important;
            cursor: pointer;
        }
    }
}

#contrast-content {
    #contrast_white_black {
        padding: 13px 16px 17px 16px;
        border: 1px solid #041F33;
        margin-right: 5px;

        img {
            height: 24px;
            width: 24px;
            margin-top: 1px;
        }

        &:hover {
            cursor: pointer;
        }
    }

    #contrast_black_white {
        padding: 13px 16px 17px 16px;
        border: 1px solid #000;
        background: #000;
        margin-right: 5px;

        img {
            height: 24px;
            width: 24px;
            margin-top: 1px;
        }

        &:hover {
            cursor: pointer;
        }
    }

    #contrast_yellow_black {
        padding: 13px 16px 17px 16px;
        border: 1px solid #FFF879;
        background: #FFF879;
        margin-right: 5px;

        img {
            height: 24px;
            width: 24px;
            margin-top: 1px;
        }

        &:hover {
            cursor: pointer;
        }
    }

    #contrast_black_yellow {
        padding: 13px 16px 17px 16px;
        border: 1px solid #000;
        background: #000;

        img {
            height: 24px;
            width: 24px;
            margin-top: 1px;
        }

        &:hover {
            cursor: pointer;
        }
    }
}

@media (min-width: 1441px) {
    .ast-container {
        max-width: 1312px;
        padding-left: 0;
        padding-right: 0;
    }
}

@media (max-width: 1440px) {
    .ast-container {
        max-width: 1312px;
    }
}

.ast-primary-header-bar {
    display: block;
    border: none;
}

body.home {
    header.entry-header {
        display: none;
    }

    div#primary {
        margin-top: 0 !important;
        border-top: 1px solid rgba(4, 31, 51, 0.1);
    }
}

#ast-scroll-top {
    display: none !important;
}

.page-share-buttons {
    margin-bottom: 64px;
    margin-left: 96px;
    display: flex;
    flex-direction: row; /* Default value, can be omitted */
    justify-content: flex-start; /* Align items to the start of the flex container */
    align-items: center; /* Align items vertically to the center */

    .title {
        font-size: 20px;
        margin-right: 16px;
    }

    .share-facebook {
        font-size: 14px;
        padding: 10px;

        &::before {
            content: '' !important;
            background-image: url(assets/icons/facebook.svg);
            display: inline-block; 
            width: 20px;
            height: 20px; 
            background-size: cover;
            background-repeat: no-repeat;
            opacity: 1;
            margin-top: 5px;
            margin-right: 10px 0 10px 10px;
        }
    }

    .share-facebook-link {
        margin-top: 16px;
    }

    a.facebook-url {
        display: flex;
        font-size: 14px;
        padding-right: 5px;
        text-decoration: none;
        color: #000;
        margin-right: 16px;

        &:hover {
            background-color: rgba(4, 31, 51, 0.1);
        }
    }

    .share-twitter {
        font-size: 14px;
        padding: 10px;

        &::before {
            content: '' !important;
            background-image: url(assets/icons/twitter.svg);
            display: inline-block; 
            width: 20px;
            height: 20px; 
            background-size: cover;
            background-repeat: no-repeat;
            opacity: 1;
            margin-top: 5px;
            margin-right: 10px 0 10px 10px;
        }
    }

    .share-twitter-link {
        margin-top: 16px;
    }

    a.twitter-url {
        display: flex;
        font-size: 14px;
        padding-right: 5px;
        text-decoration: none;
        color: #000;
        margin-right: 16px;

        &:hover {
            background-color: rgba(4, 31, 51, 0.1);
        }
    }

    .share-email {
        font-size: 14px;
        padding: 10px;

        &::before {
            content: '' !important;
            background-image: url(assets/icons/email.svg);
            display: inline-block; 
            width: 24px;
            height: 20px; 
            background-size: cover;
            background-repeat: no-repeat;
            opacity: 1;
            margin-top: 5px;
            margin-right: 10px 0 10px 10px;
        }
    }

    .share-email-link {
        margin-top: 16px;
    }

    a.email-url {
        display: flex;
        font-size: 14px;
        padding-right: 5px;
        text-decoration: none;
        color: #000;
        margin-right: 16px;

        &:hover {
            background-color: rgba(4, 31, 51, 0.1);
        }
    }

    .share-copy {
        font-size: 14px;
        padding: 10px;

        &::before {
            content: '' !important;
            background-image: url(assets/icons/copy.svg);
            display: inline-block; 
            width: 20px;
            height: 20px; 
            background-size: cover;
            background-repeat: no-repeat;
            opacity: 1;
            margin-top: 5px;
            margin-right: 10px 0 10px 10px;
        }
    }

    .share-copy-link {
        margin-top: 16px;
    }

    a.copy-url {
        display: flex;
        font-size: 14px;
        padding-right: 5px;
        text-decoration: none;
        color: #000;
        margin-right: 16px;

        &:hover {
            background-color: rgba(4, 31, 51, 0.1);
        }
    }
}

.footer-move-up {
    text-align: right;

    .move-up {
        font-size: 14px;
        float: right;
        margin-top: 20px;
        margin-bottom: 40px;

        &:before {
            content: "";
            display: inline-block; 
            width: 12px;
            height: 6px; 
            background-image: url(assets/icons/arrow_up.svg);
            background-size: cover;
            background-repeat: no-repeat;
            margin-right: 8px;
            margin-bottom: 2px; 
            transition: transform 0.3s ease;
        }

        &:hover {
            text-decoration: underline;
            cursor: pointer;
        }
    }
}

.employee-data {
    .item:first-child {
        border-top: 1px solid rgba(4, 31, 51, 0.1);
    }

    .item {
        padding-top: 24px;
        padding-bottom: 24px;
        border-bottom: 1px solid rgba(4, 31, 51, 0.1);
        display: flex;

        .item-image {
            img {
                width: 120px;
            }
        }

        .item-data {
            margin-left: 32px;
        }

        .name {
            margin-top: 5px;
            font-size: 20px;
            margin-bottom: 10px;
        }

        .position {
            font-size: 16px;
            margin-bottom: 10px;
        }

        .email, .phone {
            font-size: 14px;
        }
    }
}

blockquote.wp-block-quote {
    margin-left: 288px !important;
    margin-right: 150px !important;
    margin-bottom: 16px !important;
    line-height: 1.5;
    border-left: 5px solid #ECAE00 !important;

    p {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}

.wp-block-table {
    overflow-x: auto;
    display: block !important;
    max-width: 100% !important;
}

.wp-block-table table {
    min-width: 800px;
    width: 100%;
    border-collapse: collapse;
}

#cmplz-manage-consent {
    .cmplz-show {
        border-width: 0 !important;
    }
}

#cmplz-cookiebanner-container {
    .cmplz-header {
        display: block !important;

        .cmplz-title {
            justify-self: left !important;
            font-size: 40px;
        }
    }

    .cmplz-body {
        p {
            font-size: 16px;

            a:first-child {
                color: #000;
                text-decoration: underline;
            }

            a:last-of-type {
                display: block;
                margin-top: 30px;
                color: #000;
                text-decoration: underline;
            }
        }
    }

    .cmplz-buttons {
        .cmplz-accept, .cmplz-view-preferences, .cmplz-save-preferences {
            width: auto !important;
            padding: 0 20px !important;
            font-size: 16px !important;
        }
    }

    .cmplz-categories {
        .cmplz-functional {
            background-color: #fff !important;
            border: 1px solid rgba(0, 0, 0, 0.1) !important;

            .cmplz-always-active {
                display: none;
            }
        }

        .cmplz-category-title {
            font-size: 24px;
        }

        .cmplz-statistics {
            background-color: #fff !important;
            border: 1px solid rgba(0, 0, 0, 0.1) !important;
        }
    }

    .cmplz-documents {
        display: none;
    }
}

.cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-banner-checkbox input.cmplz-consent-checkbox {
    opacity: 1 !important;
}

.cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-banner-checkbox .cmplz-label:before,
.cmplz-cookiebanner .cmplz-categories .cmplz-category .cmplz-banner-checkbox .cmplz-label:after {
    display: none !important;
}

@media (max-width: 1070px) {
    #easy-read-content {
        #easy-read {
            font-size: 15px;
        }
    }

    #font-size-content {
        #pct_100 {
            font-size: 15px;
        }

        #pct_150 {
            font-size: 15px;
        }

        #pct_200 {
            font-size: 15px;
        }
    }

    #contrast-content {
        #contrast_white_black {
            padding: 13px 15px 13px 15px;
        }
    }

    #contrast-content {
        & #contrast_white_black {
            img {
                margin-top: -3px;
            }
        }
    }

    #contrast-content {
        #contrast_black_white {
            padding: 13px 15px 13px 15px;
        }
    }

    #contrast-content {
        & #contrast_black_white {
            img {
                margin-top: -3px;
            }
        }
    }

    #contrast-content {
        #contrast_yellow_black {
            padding: 13px 15px 13px 15px;
        }
    }

    #contrast-content {
        & #contrast_yellow_black {
            img {
                margin-top: -3px;
            }
        }
    }

    #contrast-content {
        #contrast_black_yellow {
            padding: 13px 15px 13px 15px;
        }
    }

    #contrast-content {
        #contrast_black_yellow {
            img {
                margin-top: -3px;
            }
        }
    }
}

@media (max-width: 1024px) {
    #sub-menu-inner-title {
        font-size: 32px;
        margin-bottom: 32px;
    }

    #sub-menu-inner-sub-title {
        font-size: 16px;
    }

    #easy-read-content {
        #easy-read {
            font-size: 14px;
            padding: 8px 10px 8px 10px;
        }
    }

    #font-size-content {
        #pct_100 {
            font-size: 14px;
            padding: 8px 10px 8px 10px;
        }

        #pct_150 {
            font-size: 14px;
            padding: 8px 10px 8px 10px;
        }

        #pct_200 {
            font-size: 14px;
            padding: 8px 10px 8px 10px;
        }
    }

    #contrast-content {
        #contrast_white_black {
            padding: 8px 10px 8px 10px;
        }
    }

    #contrast-content {
        & #contrast_white_black {
            img {
                height: 20px;
                width: 20px;
                margin-top: -3px;
            }
        }
    }

    #contrast-content {
        #contrast_black_white {
            padding: 8px 10px 8px 10px;
        }
    }

    #contrast-content {
        & #contrast_black_white {
            img {
                height: 20px;
                width: 20px;
                margin-top: -3px;
            }
        }
    }

    #contrast-content {
        #contrast_yellow_black {
            padding: 8px 10px 8px 10px;
        }
    }

    #contrast-content {
        & #contrast_yellow_black {
            img {
                height: 20px;
                width: 20px;
                margin-top: -3px;
            }
        }
    }

    #contrast-content {
        #contrast_black_yellow {
            padding: 8px 10px 8px 10px;
        }
    }

    #contrast-content {
        #contrast_black_yellow {
            img {
                height: 20px;
                width: 20px;
                margin-top: -3px;
            }
        }
    }

    input#search-field {
        font-size: 20px;
        height: 70px;
    }

    .ast-search-submit {
        height: 60px;
    }
}

@media (max-width: 1024px) {
    .ast-separate-container #primary {
        padding-top: 0 !important;
    }
}

@media (max-width: 1200px) {
    .ast-plain-container.ast-no-sidebar #primary {
        margin-bottom: 60px;
    }
}

@media (max-width: 900px) {
    #sub-menu-inner-title {
        font-size: 26px;
        margin-bottom: 26px;
    }

    #sub-menu-inner-sub-title {
        font-size: 14px;
    }

    #easy-read-content {
        #easy-read {
            font-size: 12px;
            padding: 8px 8px 8px 8px;
        }
    }

    #font-size-content {
        #pct_100 {
            font-size: 12px;
            padding: 8px 8px 8px 8px;
        }

        #pct_150 {
            font-size: 12px;
            padding: 8px 8px 8px 8px;
        }

        #pct_200 {
            font-size: 12px;
            padding: 8px 8px 8px 8px;
        }
    }

    #contrast-content {
        #contrast_white_black {
            padding: 6px 8px 8px 8px;
        }
    }

    #contrast-content {
        & #contrast_white_black {
            img {
                height: 16px;
                width: 16px;
                margin-top: -1px;
            }
        }
    }

    #contrast-content {
        #contrast_black_white {
            padding: 6px 8px 8px 8px;
        }
    }

    #contrast-content {
        & #contrast_black_white {
            img {
                height: 16px;
                width: 16px;
                margin-top: -1px;
            }
        }
    }

    #contrast-content {
        #contrast_yellow_black {
            padding: 6px 8px 8px 8px;
        }
    }

    #contrast-content {
        & #contrast_yellow_black {
            img {
                height: 16px;
                width: 16px;
                margin-top: -1px;
            }
        }
    }

    #contrast-content {
        #contrast_black_yellow {
            padding: 6px 8px 8px 8px;
        }
    }

    #contrast-content {
        #contrast_black_yellow {
            img {
                height: 16px;
                width: 16px;
                margin-top: -1px;
            }
        }
    }

    input#search-field {
        font-size: 16px;
        height: 64px;
    }

    .ast-search-submit {
        height: 40px;
    }

    .ast-search-submit {
        &::before {
            width: 18px !important;
            height: 18px !important;
        }
    }
}

@media (max-width: 610px) {
    .page-share-buttons {
        display: block !important;
    }

    header .custom-logo-link img {
        max-width: 100% !important;
    }
}

@media (max-width: 768px) {
    blockquote.wp-block-quote {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    figure.wp-block-audio {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
    
    .text_with_title {
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}