﻿.hide {
    display: none;
}

.top-left-border-straight {
    border-top-left-radius: 0px !important;
}

#prime-bundles.bundles {
    display: flex;
    flex-direction: column;
}

#prime-bundles.bundles-container {
    display: flex;
    flex-direction: column;
}

#prime-bundles.bundle {
    display: flex;
    margin: 5px 0;
    border-style: solid;
    padding: 10px 15px;
    flex-direction: column;
    overflow: auto;
}

#prime-bundles.bundle-item {
    display: flex;
    flex-direction: row;
    min-height: 75px;
    background: inherit;
    padding-top: 5px;
    padding-bottom: 5px;
    gap: 1rem
}

#prime-bundles.bundle-item * {
    background: inherit;
}

#prime-bundles.bundle-variants {
    display: flex;
    flex-direction: column;
}

#prime-bundles.bundle-variants-options {
    display: flex;
    margin-bottom: 10px;
    flex-wrap: wrap;
}

#prime-bundles.bundle-variants-option {
    display: flex;
    flex-direction: column;
    max-width: 90%;
    margin-right: 10px;
}

#prime-bundles.bundle-variant-item-number {
    display: flex;
    align-items: center;
    font-weight: 600;
    margin-right: 10px;
    width: 10px;
    justify-content: center;
}

#prime-bundles.bundle-variant-label {
    font-weight: 600;
}

#prime-bundles.bundle-image {
    display: flex;
    align-items: center;
}

#prime-bundles.bundle-image-img {
    max-height: 60px;
    max-width: 60px;
    object-fit: contain;
    border-radius: 10px;
}

/** Mobile Screen Text Scaling **/
@media screen and (max-width: 768px) {
    #prime-bundles.bundle-title {
        font-size: calc(var(--title-font-size) * .9);
    }
    #prime-bundles.bundle-label {
        font-size: calc(var(--label-font-size) * .8 );
    }
    #prime-bundles.bundle-subtitle {
        font-size: calc(var(--subtitle-font-size) * .9);
    }
    #prime-bundles.bundle-legend {
        font-size: calc(var(--header-font-size) * .9);
    }
    #prime-bundles.prime-bundle-price, #prime-bundles.discounted-price {
        font-size: 16px;
    }
    .label-under-price > #prime-bundles.discounted-price {
        font-size: 14px;
    }
    #prime-bundles.bundle-item {
        gap: .5rem
    }
}

@media screen and (min-width: 768px) {
    #prime-bundles.bundle-title {
        font-size: var(--title-font-size);
    }
    #prime-bundles.bundle-label {
        font-size: var(--label-font-size);
    }
    #prime-bundles.bundle-subtitle {
        font-size: var(--subtitle-font-size);
    }
    #prime-bundles.bundle-legend {
        font-size: var(--header-font-size);
    }
    #prime-bundles.prime-bundle-price, #prime-bundles.discounted-price {
        font-size: 18px;
    }
}

#prime-bundles.not-selected-bundle .prime-bundle-price {
    color: var(--not-selected-price-color, var(--is-selected-color, #000000));
}

#prime-bundles.is-selected-bundle .prime-bundle-price {
    color: var(--selected-price-color, var(--is-selected-color, #000000));
}

#prime-bundles.bundle-title-and-label {
    display: flex;
    flex-direction: row;
    gap: 4px;
    align-items: center;
    flex: 1;
}

#prime-bundles.bundle-subtitle {
    flex: 1;
    text-align: left;
    display: flex;
    align-items: center;
}

#prime-bundles.bundle-label {
    border-radius: 10px;
    margin-left: 10px;
    margin-right: 10px;
    border-width: 1px;
    border-style: solid;
    padding: 5px 10px;
    text-wrap: nowrap;
    white-space: nowrap;
}

#prime-bundles.bundle-label.label-bottom {
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    right: 0px;
    left: 0px;
    bottom: -6px;
    width: fit-content;
    padding: 1px 15px;
    z-index: 100;
    max-width: 100%;
}

@media (max-width: 768px)  {
    #prime-bundles.bundle-label.label-bottom {
        bottom: 0px;
    }
}

#prime-bundles.bundle-label.label-bottom.condensed {
    bottom: -4px;
    padding: 2px 15px;
}

#prime-bundles.bundle-label.label-above-bundle {
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    right: 0px;
    left: 0px;
    top: -6px;
    width: fit-content;
    padding: 1px 15px;
    z-index: 100;
    max-width: 100%;
}

#prime-bundles.bundle-label.label-above-bundle.condensed {
    top: -3px;
    padding: 2px 15px;
}

#prime-bundles.bundle-radio-button-container {
    display: flex;
    align-items: center;
}

#prime-bundles.bundle-radio-button {
    appearance: none;
    width: 25px;
    height: 25px;
    border: 2px solid #555555;
    border-radius: 50%;
    padding: 3px;
    background-clip: content-box;
    cursor: pointer;
}

#prime-bundles.bundle-radio-button.checked {
    background-color: var(--is-selected-color) !important;
}

#prime-bundles.bundle-prices {
    justify-content: center;
    display: flex;
    flex-direction: column;
    align-items: end;
}

#prime-bundles.bundle-text {
    display: flex;
    flex-direction: column;
    flex: 1 1 auto;
    justify-content: center;
}

#prime-bundles.prime-bundle-price {
    font-weight: 700;
    align-items: center;
    display: flex;
    flex: 1;
    text-wrap: nowrap;
    white-space: nowrap;
}

#prime-bundles.discounted-price {
    text-decoration: line-through;
    flex: 1;
    text-wrap: nowrap;
    white-space: nowrap;
    display: flex;
    align-items: center;
}

#prime-bundles.bundle-legend {
    text-align: center;
    width: 100%;
    text-transform: uppercase;
    margin-bottom: 16px;
    overflow: hidden;
    direction: ltr;
}

#prime-bundles.bundle-legend::before {
    content: "";
    background-color: var(--bundle-legend-color);
    height: 2px;
    width: 50%;
    display: inline-block;
    vertical-align: middle;
    margin-left: -50%;
}

#prime-bundles.bundle-legend::after {
    content: "";
    background-color: var(--bundle-legend-color);
    height: 2px;
    width: 50%;
    display: inline-block;
    vertical-align: middle;
    margin-right: -50%;
}

#prime-bundles.prime-bundle-variant-select {
    border-width: 1px;
    border-color: black;
    min-height: 30px;
    padding-left: 0.75rem;
    margin-bottom: 0px;
}

#prime-bundles.bundle-variants-label {
    font-size: 12px;
    margin-bottom: 0px;
    margin-top: 0px;
    text-overflow: ellipsis;
    overflow: hidden;
}

#prime-bundles.is-selected-bundle {
    cursor: pointer;
    border-color: var(--is-selected-border-color);
    background-color: var(--is-selected-background-color);
}

#prime-bundles.is-selected-bundle .bundle-radio-button {
    accent-color: var(--is-selected-color);
}

#prime-bundles.is-selected-bundle .bundle-label {
    color: var(--is-selected-color);
    border-color: var(--is-selected-border-color);
}

#prime-bundles.not-selected-bundle {
    cursor: pointer;
    border-color: var(--not-selected-border-color);
    background-color: var(--not-selected-background-color);
}

#prime-bundles.not-selected-bundle .bundle-radio-button {
    accent-color: white;
}

#prime-bundles.not-selected-bundle .bundle-label {
    color: var(--not-selected-color);
    border-color: var(--not-selected-border-color);
}

#prime-bundles.not-selected-bundle .bundle-variants {
    display: none;
}

#prime-bundles.pb-buy-button-container {
    display: flex;
    flex-direction: column;
    width: 100%;
}

#prime-bundles.pb-buy-button-text {
    text-align: center;
    background: inherit;
}

#prime-bundles.relative-wrapper {
    position: relative;
}

#prime-bundles.bundle-prices-wrapper {
    display: flex;
    flex-direction: column;
}
  
#prime-bundles.bundle-prices-wrapper > * {
    flex: 1;
    display: flex;
}

/**
*
*
* Ribbons
*
*
*/

#prime-bundles.bundle-item:has(~.pb-ribbon-style-one-container), #prime-bundles.bundle-item:has(~.pb-ribbon-style-four-container) {
    padding-top: 8px;
}

#prime-bundles.bundle-item.condensed:has(~.pb-ribbon-style-one-container) {
    padding-top: 5px;
}

#prime-bundles.bundle-item.condensed:has(~.pb-ribbon-style-three-container), #prime-bundles.bundle-item.condensed:has(~.pb-ribbon-style-four-container) {
    padding-top: 8px;
    padding-bottom: 2px;
}

#prime-bundles.pb-ribbon-style-one-container {
    position: absolute;
    top: 0px;
    right: 1rem; 
}

#prime-bundles.pb-ribbon-style-one {
    position: relative;
}

#prime-bundles.pb-ribbon-style-one-bottom {
    border-left: 63px solid transparent;
    border-right: 63px solid transparent;
    border-top: 5px solid;
    display: block;
}
#prime-bundles.pb-ribbon-style-one-text {
    text-align: center;
    padding-top: 3px;
    border-top-right-radius: 8px;
    width: 125px;
    /* font-size: 1.2rem; */
    font-size: 12px;
    line-height: 1.5;
}
#prime-bundles.pb-ribbon-style-one-span-a, .pb-ribbon-style-one-span-b {
    position: absolute;
}
#prime-bundles.pb-ribbon-style-one-span-b {
    height: 6px;
    width: 6px;
    left: -6px;
    top: 0;
    display: block;
}
#prime-bundles.pb-ribbon-style-one-span-a {
    height: 6px;
    width: 8px;
    left: -8px;
    top: 0;
    border-radius: 8px 8px 0 0;
    display: block;
}


#prime-bundles.pb-ribbon-style-two-sheer-main {
    position: absolute;
    top: -4px;
    right: 2rem; 
}

#prime-bundles.pb-ribbon-style-two-sheer {
    line-height: 23px;
    position: relative;
    min-width: 170px;
    padding: 0 5px;
    text-wrap: nowrap;
    box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;
}

#prime-bundles.pb-ribbon-style-two-sheer-after, #prime-bundles.pb-ribbon-style-two-sheer-before {
    border-width: 22px 10px 0 0;
    display: block;
    position: absolute;
    border-style: solid;
}

#prime-bundles.pb-ribbon-style-two-sheer-after {
    top: 0px;
    right: -11px;
    border-color: lightblue transparent;
}

#prime-bundles.pb-ribbon-style-two-sheer-before {
    left: -11px;
    border-color: transparent lightblue;
}

#prime-bundles.pb-ribbon-style-two-sheer-text {
    display: flex;
    justify-content: center;
}

#prime-bundles.pb-ribbon-style-three-container {
    position: absolute;
    top: -35px;
    right: -18px;
}

#prime-bundles.pb-ribbon-style-four-container {
    top: -40px;
    right: -15px;
    transform: rotate(10deg);
    position: absolute;
}

@media (max-width: 520px)  {
    #prime-bundles.pb-ribbon-style-four-container {
        right: -8px;
    }
    #prime-bundles.pb-ribbon-style-three-container {
        right: -15px;
    }
    /* .is-selected-bundle + #prime-bundles.pb-ribbon-style-four-container {
        right: -5px;
    }
    .is-selected-bundle + #prime-bundles.pb-ribbon-style-three-container {
        right: -12px;
    } */
}

#prime-bundles.pb-ribbon-style-five-container {
    position: absolute;
    top: -18px;
    left: 0px;
}

#prime-bundles.pb-ribbon-style-five {
    text-align: center;
    border-top-right-radius: 8px;
    border-top-left-radius: 8px;
    width: 125px;
    line-height: 23px;
    font-size: 14px;
}

/*
*
*
*  Bundle Styles
*
*
*/

#prime-bundles.bundle.condensed {
    /* padding: 12px 15px; */
    min-height: 80px;
    line-height: normal;
}
  
#prime-bundles.bundle-item.condensed {
    min-height: auto;
    flex: 1;
    margin: 3px 0px;
    padding-top: 3px;
}
  
#prime-bundles.bundle-variants.condensed {
    margin-top: 4px;
}
  
#prime-bundles.bundle-variants-option.condensed {
    margin-bottom: 5px
}
  
#prime-bundles.prime-bundle-variant-select.condensed {
    height: 23px;
    min-height: auto;
    padding: 0px 0px 0px 8px;
}
  
#prime-bundles.bundle-radio-button.condensed{
    height: 21px;
    width: 21px;
}
  
#prime-bundles.bundle-label.condensed {
    padding: 2px 7px;
}

#prime-bundles.bundle-image-img.condensed {
    max-height: 55px;
    max-width: 55px;
}

#prime-bundles.pb-atc-error-messsage {
    color: red;
    font-size: 1.2rem;
}

#prime-bundles.pb-buy-button-container.no-available-var {
    opacity: 60%;
    pointer-events: none;
}

#prime-bundles.pb-buy-button-container + div[data-shopify="payment-button"].hide {
    display: none !important;
}

#prime-bundles.bundle-prices.label-under-price {
    flex-direction: row-reverse;
    column-gap: 8px;
    row-gap: 3px;
    justify-content: end;
    flex-wrap: wrap;
    padding-right: 1px;
    align-items: center;
}

#prime-bundles.bundle-prices.label-under-price > * {
    flex: unset
}

#prime-bundles.bundle-label.label-under-price {
    margin-left: 0px;
    margin-right: 0px;
}
  
#prime-bundles.bundle-label-container.label-under-price {
    justify-content: end;
    align-items: center;
}

/*
*
*
*  Animations
*
*
*/

#prime-bundles.wrapper-hover:has(.is-selected-bundle){
    scale: 102%;
    transition: all .3s
}

#prime-bundles.wrapper-hover:hover{
    scale: 102%;
    transition: all .3s
}

#prime-bundles.bundle.bundle-item-color-hover:hover{
    border-color: var(--is-selected-border-color);
    background-color: var(--is-selected-background-color);
}

#prime-bundles.buy-button-hover:hover{
    scale: 102%;
    transition: all .3s
}

#prime-bundles.buy-buttons-shaking{
    animation: button-tilt-shaking 0.8s linear infinite;
}

@keyframes button-tilt-shaking {
  0%  { -webkit-transform: translate(2px, 1px) rotate(0deg); }
  10% { -webkit-transform: translate(-1px, -2px) rotate(-2deg); }
  20% { -webkit-transform: translate(-2px, 0px) rotate(3deg); }
  30% { -webkit-transform: translate(0px, 2px) rotate(0deg); }
  40% { -webkit-transform: translate(1px, -1px) rotate(1deg); }
  50% { -webkit-transform: translate(-1px, 2px) rotate(-1deg); }
  60% { -webkit-transform: translate(-2px, 1px) rotate(0deg); }
  70% { -webkit-transform: translate(2px, 1px) rotate(-2deg); }
  80% { -webkit-transform: translate(-1px, -1px) rotate(4deg); }
  90% { -webkit-transform: translate(2px, 2px) rotate(0deg); }
  100%{ -webkit-transform: translate(1px, -2px) rotate(-1deg); }
}

/*
*
*
*  Horizontal
*
*
*/

#prime-bundles.bundle-layout-horizontal {
    display: flex;
    gap: 10px;
    padding: 10px 0px;
    margin: 0px;
    flex-direction: row;
    justify-content: center;
}

#prime-bundles.bundle-layout-horizontal > * {
    max-width: 33%;
    flex: 1;
    width: 100px;
    height: fit-content;
    margin-top: 5px !important;
}
  
#prime-bundles.bundle-horizontal-container.bundle-badge-style-five-container {
    margin-top: 16px !important;
}
  
#prime-bundles.bundle-badge-style-five-container ~ .bundle-horizontal-container {
    margin-top: 16px;
}
  
#prime-bundles.bundle-item.layout-horizontal.bundle-container-label-bottom-preview {
    margin-bottom: 10px;
}
  
#prime-bundles.bundle-item.layout-horizontal {
    flex-direction: column;
    align-items: center;
}

#prime-bundles.bundle-item.label-under-price.layout-horizontal {
    padding-bottom: 0px;
}
  
#prime-bundles.bundle-image-img.layout-horizontal {
    max-height: 100px !important;
    max-width: 100px !important;
}
  
#prime-bundles.bundle-image-img.layout-horizontal.condensed {
    max-height: 90px !important;
    max-width: 90px !important;
}

@media (max-width: 768px)  {
    #prime-bundles.bundle-image-img.layout-horizontal {
        max-height: 80px !important;
        max-width: 80px !important;
    }
      
    #prime-bundles.bundle-image-img.layout-horizontal.condensed {
        max-height: 70px !important;
        max-width: 70px !important;
    }    
}
  
#prime-bundles.bundle-prices.layout-horizontal {
    flex-direction: column;
    align-items: center;
    gap: 2px;
}

#prime-bundles.bundle-title.layout-horizontal,
#prime-bundles.bundle-prices.layout-horizontal > *, 
#prime-bundles.bundle-text.layout-horizontal > .bundle-subtitle {
    line-height: 1.2;
}

#prime-bundles.bundle.layout-horizontal.label-bottom {
    margin-bottom: 12px;
}

#prime-bundles.bundle-item.layout-horizontal,
#prime-bundles.bundle-prices-wrapper.layout-horizontal,
#prime-bundles.bundle-text.layout-horizontal {
    gap: 4px;
}
  
#prime-bundles.bundle-text.layout-horizontal > * {
    justify-content: center;
    text-align: center;
}
  
#prime-bundles.pb-ribbon-style-five-container.layout-horizontal {
    top: -22px;
    bottom: 96%;
    width: 100%;
}

#prime-bundles.pb-ribbon-style-five-container.layout-horizontal > .pb-ribbon-style-five {
    line-height: 28px;
    width: 100%;
}
  
#prime-bundles.layout-horizontal.top-left-border-straight {
    border-top-right-radius: 0px !important;
}

#prime-bundles.bundle.layout-horizontal {
    margin-top: 5px;
}
  
#prime-bundles.bundle-item.bundle-label-above-preview-container.layout-horizontal {
    margin-top: 10px;
}

#prime-bundles.bundle-label.label-above-bundle.layout-horizontal {
    padding: 1px 5px;
}

#prime-bundles.bundle-variants-options.layout-horizontal,
#prime-bundles.bundle-prices-wrapper.layout-horizontal > .label-under-price {
    justify-content: center;
}

#prime-bundles.bundle-label.layout-horizontal {
    padding: 1px 5px;
}

#prime-bundles.bundle-label.label-bottom.layout-horizontal {
    bottom: 0px;
}

#prime-bundles.bundle-label.label-bottom.layout-horizontal.condensed {
    bottom: 4px;
}

#prime-bundles.bundle-label.label-above-bundle.layout-horizontal.condensed {
    top: 0px
}

#prime-bundles.bundle-title-and-label.layout-horizontal {
    flex-direction: column;
}

#prime-bundles.bundle-variants-options.layout-horizontal > #prime-bundles.bundle-variant-item-number,
#prime-bundles.bundle-variants-options.layout-horizontal > .bundle-variants-option {
    max-width: unset;
    margin-right: 0px !important;
}

#prime-bundles.bundle-variants-options.layout-horizontal {
    column-gap: 10px;
}

#prime-bundles.bundle-variants-options.layout-horizontal > .bundle-variants-option {
    width: 100% !important;
}

#prime-bundles.bundle-variants-options.layout-horizontal > #prime-bundles.bundle-variant-item-number {
    line-height: 1;
}

#prime-bundles.bundle-variants-options.layout-horizontal > .bundle-variants-option > .bundle-variants-label {
    text-align: center;
}