.q-med-section {
    margin: 0 0 70px 0;
    float:left;
}
.q-medals .floating-label {
    position: absolute !important;
    z-index: 99;
    top: -12px !important;
    left: 25px !important;
    transition: all 0.1s ease-in-out !important;
    background-color: var(--color-white) !important;
    pointer-events: none !important;
    color: var(--color-button);
    padding: 5px 10px;
    font-size: 12px;
    height: 18px !important;
    width: max-content !important;
}
.q-medals input.form-control {
    border: 1px solid var(--color-border)!important;
    border-radius: 23px !important;
    font-size: 14px;
}
.q-medals select#color, .q-medals input#amount {
    border: 1px solid var(--color-button)!important;
    height:45px;
    background-position: right 10px center; 
} 

.q-medals select.form-control {
    font-size: 14px!important;
}
.q-medals .form-control:focus {
    box-shadow: none;
    border: 1px solid var(--color-button)!important;
}

.q-medals table tfoot th,
.q-medals table thead th {
    color: var(--color-default)!important;
    font-size: 16px;
    font-weight: 400;
}

.q-medals button.btn-cart-red-outline {
    border: 1px solid var(--color-button);
    background: var(--color-button)!important;
    border-radius: 35px !important;
    color: var(--color-secondary) !important;
    display: flex !important;
    font-weight: 400 !important;
    font-size: 1rem !important;
    font-family: var(--font-headings-regular) !important;
    line-height: 1.5rem !important;
    padding: 6px 22px !important;
    width: auto;
    -webkit-box-shadow: 0 5px 7px 1px rgba(0, 0, 0, .32) !important;
    -moz-box-shadow: 0 5px 7px 1px rgba(0, 0, 0, .32) !important;
    box-shadow: 0 5px 7px 1px rgba(0, 0, 0, .32) !important;
}
.q-medals button.btn-cart-red-outline:hover {
    border: 1px solid var(--color-button);
    background: var(--color-secondary)!important;
    color: var(--color-button)!important;
}

button.btn-outline-info-modal,
button.btn-outline-info-modal:focus {
    border: none;
    background: var(--color-white);
    border-radius: 50%;
    height: 20px;
    width: 20px;
    line-height: 14px;
    color: var(--color-button);
}
button.btn-outline-info-modal:hover {
    background: var(--color-white);
    transform: scale(1.1);
}

/* checkbox */
.q-medals .form-check {
    display: block;
    padding-left: 0;
}
.q-medals .form-switch .form-check-input {
    margin-top: 0.3em;
    margin-left: 10px;
    float: right !important;
    position: relative;
    background-color: var(--bs-gray-400);
    height: 0.9375rem;
    width: 1.875rem;
    background-image: none;
    background-position: left center;
    border-radius: 1.875rem;
    transition: background-color 0.25s ease, border-color 0.25s ease, background-position 0.15s ease-in-out, opacity 0.15s ease-out, box-shadow 0.15s ease-in-out;
}
.q-medals .form-switch .form-check-input:after {
    transition: transform 0.25s ease-in-out, background-color 0.25s ease-in-out;
    content: "";
    width: 1.25rem;
    height: 1.25rem;
    border-radius: 50%;
    border: 1px solid var(--bs-gray-400);
    position: absolute;
    background-color: var(--color-white);
    transform: translateX(1px);
    box-shadow: 0 4px 6px -1px rgba(25, 142, 150, 0.1), 0 2px 4px -1px rgba(25, 142, 150, 0.06);
    top: -2.5px;
    left: -5px;
}

.q-medals .form-check-input:focus {
    outline: none;
    box-shadow: none;
}

.form-check-input[type="checkbox"],
.q-medals .form-check-label {
    cursor: pointer;
}

.q-medals .form-switch .form-check-input:checked {
    border-color: var(--color-button);
    background-color: var(--color-button);
    background-position: right center;
    background-image: none;
}

.q-medals .form-switch .form-check-input:checked:after {
    transform: translateX(21px);
    border-color: var(--color-border);
}
.qmedal-record div{
    font-size:1.1rem!important;
}
.qmedal-record a.accordion-button,
.qmedal-record a.remove-item {
    cursor: pointer;
}

.qmedal-loader {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    text-align: center;
    padding: 10px;
    font-style: italic;
    color: #999;
    width:100%;
    height:100%;
    background-color: var(--color-secondary-dark);
    position: absolute; 
    top: 50%; left: 
    50%; transform: translate(-50%, -50%);
}

.ribbon-item:hover {
    border-color: var(--color-button);
    background: var(--color-border);
}

.ribbon-item {
    display: inline-block;
    cursor: pointer;
    text-align: center;
    position: relative;
}

.ribbon-radio {
    position: absolute;
    opacity: 0;
    pointer-events: none;
}

.ribbon-content {
    padding: 10px;
    border-radius: 8px;
    border: 2px solid transparent;
    transition: all 0.3s ease;
}

.ribbon-radio:checked ~ .ribbon-content {
    border-color: var(--color-links-hover);
    box-shadow: 0 0 4px rgba(25, 142, 150, 0.4);
    background-color: var(--color-secondary-dark);
}

.ribbons-carousel .owl-next {
    position: absolute;
    right: -48px;
    top: 25%;
}
.ribbons-carousel .owl-prev {
    position: absolute;
    left: -48px;
    top: 25%;
}
.summary-qmedals {
    background-color: var(--color-secondary-dark);
    border-radius: 8px;
}

span.product-price-q {
    display:block!important;
}
.qmedal-thumb {
    display:block;
}

.cart-line span.checkmark  {
    padding: 0px 4px;
    margin-right:3px;
	color: var(--color-white);
	background: linear-gradient(315deg, var(--color-green-accent-hover) 0, var(--color-green-accent) 100%);
	border-radius: 50%;
}

#qmedal-order .input-group-q {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  max-width:100%;
}

#uvPrintModal .modal-dialog, 
#selectQRibbonModal .modal-dialog,
#addFileModal .modal-dialog {
    max-width: 800px;
}

/****
** MEDIA QUERIES
****/
@media(max-width:1200px) {
    .q-med-section {
        float: none;
    }
}
@media(min-width:991.92px) {
    .summary-qmedals {
        position: sticky;
        top: 110px;
    }
}
@media(max-width:576.98px) {
    .qmedal-thumb {
        display:none;
    }

    .ribbons-carousel .owl-next {
        right: -20px;
    }
    .ribbons-carousel .owl-prev {
        left: -20px;
    }

    #add-to-cart-bulk .fw-bold div {
        font-size:1.1rem!important;
    }

}