/*
.naryste-item {
    background-color: blue;
    padding: 10px;
}
*/

/* borderio taisykles */

.naryste-border-callout {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.naryste-border-callout.inactive {
    color: var(--am-background-color);
    /* padding-top: 1rem; */
    padding-bottom: 1rem;
    border-radius: 1.5rem;
    color: var(--am-text-color);
    /* border: 2px solid #2e2e2e; */
}

.naryste-border-callout.active {
    background-color: var(--am-accent-color);
    color: var(--am-background-color);
    padding-bottom: 1rem;
    border-radius: 1.5rem;
}

p.naryste-border-callout-text.active, p.naryste-border-callout-text.inactive {
    margin: 0px !important;
    font-size: 1rem;
}

.naryste-border-callout-text-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 3rem;
}

.naryste-info.inactive {
    background-color: var(--am-background-color);
    width: calc(100% - 2rem);
    border-radius: 1rem;
    padding: calc(1rem - 0px);
    outline: 2px solid var(--am-text-color);;
}

.naryste-info.active {
    background-color: var(--am-background-color);
    width: calc(100% - 2rem);
    border-radius: 1rem;
    padding: calc(1rem - 0px);
}

.naryste-info h4, .naryste-info h3, .naryste-info-savybe-tooltip > p {
    margin: 0px;
}

.naryste-info > div > div > h3 {
    color: var(--am-accent-color);
}


/* virsutine eilute (kaina ir pavadinimas) */

.naryste-info-top-row h3 {
    font-size: var(--bt-font-size-h1, 64px);
}

.naryste-info-top-row h4 {
    font-size: var(--bt-font-size-h3, 32px);
    margin-top: 0.5rem;
    margin-bottom: 0.5rem;
}

.naryste-info-kaina-galutine h3 {
    color: var(--am-accent-color) !important;
}

.naryste-info-kaina-galutine sup {
    font-size: 40% !important;
    top: -1rem !important;
    white-space: nowrap;
    color: var(--am-text-color) !important;
}


/* mostly savybes ir pirkti taisykles */

.naryste-info-savybes, .naryste-info-pirkti {
    margin-top: 1rem;
}

.naryste-info-savybes > *:not(:first-child) {
  margin-top: 0.5rem;
}

.naryste-info-savybe {
    display: inline-flex;
    color: var(--am-text-color);
    align-items: center;
    gap: 0.5rem
}

.naryste-info-savybe > p {
    margin: 0;
    flex: 1 1 auto;
    display: inline;
}

.naryste-info-savybes {
    display: flex;
    flex-direction: column;
}


.naryste-info-savybe-tooltip-wrapper {
    position: relative;
    display: inline-block;
}

.naryste-info-savybe-tooltip {
    opacity: 0;
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-94.5%);
    transition: opacity 0.5s ease;
    padding: 1rem;
    border: 2px solid var(--am-accent-color);
    border-radius: 0.5rem;
    background-color: var(--am-background-color);
    width: 40vw;
    box-shadow: 0rem 0rem 2rem rgba(0,0,0,1);

    pointer-events: none;
}

.naryste-info-savybe-tooltip-wrapper:hover .naryste-info-savybe-tooltip {
    opacity: 1;
    transition: opacity 0.5s ease;
    z-index: 101;
}

p.naryste-info-pirkti-mygtukas-text {
    margin-left: 0.5rem;
    margin-right: 0.5rem;
    margin-bottom: 0px;
}

svg.naryste-info-savybe-checkmark {
    height: 1.5rem !important;
    width: 1.5rem !important;
    flex-shrink: 0;
    fill: limegreen;
}

svg.naryste-info-savybe-icon, svg.naryste-info-pirkti-mygtukas-arrow {
    height: 1rem;
    width: 1rem;
    flex-shrink: 0;
    /* fill: var(--am-text-color); */
}

svg.naryste-info-pirkti-mygtukas-arrow {
    margin-top: 0.125rem;
}


/* pirkti sectiono taisykles */

.naryste-info-pirkti-mygtukas {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    margin: 0px;
    padding: 0.5rem;
    background-color: var(--am-accent-color);
    border: 2px solid var(--am-background-color);
    color: var(--am-background-color) !important;
    fill: var(--am-background-color) !important;
    border-radius: 0.5rem;
    text-decoration: none !important;
    transition: color 0.5s ease, background-color 0.5s ease, border-color 0.5s ease, opacity 0.5s ease;
}

.naryste-info-pirkti-mygtukas:hover {
    background-color: var(--am-background-color);
    border: 2px solid var(--am-accent-color);
    color: var(--am-accent-color) !important;
    transition: color 0.5s ease, background-color 0.5s ease, border-color 0.5s ease, opacity 0.5s ease;
}


/* slick ir karuseles taisykles */
    
.naryste-carousel .slick-slide {
  transition: all 0.3s ease;
  opacity: 0.8;
  transform: scale(0.85);
  filter: brightness(0.8);
  z-index: 1 !important;
}

.naryste-carousel .slick-center {
  opacity: 1;
  transform: scale(1);
  filter: brightness(1);
  z-index: 100;
}

.naryste-carousel .slick-list {
  margin: 0 -10px; /* compensate padding */
}


.naryste-carousel {
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    box-sizing: content-box;
}

.slick-progress {
    margin-top: 2rem;
    display: flex;
    width: 100%;
    height: 0.25rem;
    background: #2e2e2e; /* background for unlit segments */
}

.slick-progress .segment {
    flex: 1;
    margin-right: 0.25rem; /* small gap between segments */
    background: #2e2e2e;
    transition: background 0.5s;
}

.slick-progress .segment.active {
    background: var(--am-accent-color); /* color for lit segment */
}

.slick-progress .segment:last-child {
    margin-right: 0;
}


/* responsive */

@media (max-width: 991px) {
    .naryste-info-kaina-galutine sup {
        font-size: 50% !important;
        top: -0.625rem !important;
        white-space: nowrap;
        color: var(--am-text-color) !important;
    }
}

@media (min-width: 768px) {
    .naryste-info-top-row {
        display: flex;
        flex-direction: row;
        
        align-items: center;
        gap: 2rem;
        margin-bottom: 2rem;
    }
    .naryste-info-top-row > * {
        flex: 1;
    }
    .naryste-info-top-row h3 {
        font-size: var(--bt-font-size-h3, 48px);
    }
    
    .naryste-info-top-row h4 {
        font-size: var(--bt-font-size-h4, 32px);
        margin: 0px;
    }
    .naryste-info-pavadinimas {
        text-align: right;
    }
    .naryste-info-savybe-tooltip {
        width: 30vw;
    }
    .slick-progress {
        margin-top: 4rem;
    }
}

@media (min-width: 1200px) {
    .naryste-info-top-row h3 {
        font-size: var(--bt-font-size-h2, 48px);
    }
    
    .naryste-info-top-row h4 {
        font-size: var(--bt-font-size-h3, 32px);
        margin: 0px;
    }
    .naryste-info-pirkti-mygtukas {
        margin-left: 35%;
        margin-right: 35%;
    }
}