.header-cesta {
    display: grid;
    grid-template-columns: auto 80px 130px;
    padding: 10px 0;
    border-bottom: 1px solid #ddd;
}

.header-cesta h5 {
    margin: 0;
    text-align: center;
    font-weight: bold;
    font-size: 1em;
}

.header-cesta h5:first-child {
    text-align: left;
}
.product {
    display: flex!important;
    align-items: flex-start!important;
    gap: 20px!important;
    padding: 20px!important;
    border-radius: 10px;
    border: 1px solid #ddd;
    background-color: #f9f9f9;
}

.product img {
    flex-shrink: 0!important;
}

.captionCratos {
    flex-grow: 1!important;
    padding-top: 5px!important;
}

.captionCratos h3 {
    margin: 0!important;
    font-size: 1.2em!important;
}

.captionCratos p {
    margin: 0!important;
    font-size: 0.9em!important;
    color: #555!important;
}

.details-wrapper {
    display: flex!important;
    flex-direction: row!important;
    align-items: center!important;
    gap: 20px!important;
    padding-top: 5px!important;
}

.qty-label {
    display: flex!important;
    flex-direction: column!important;
    align-items: center!important;
    font-size: 0.9em!important;
}
.input-number {
    display: flex!important;
    align-items: center!important;
    justify-content: center!important;
    position: relative!important;
}
.qtd-input {
    width: 60px!important;
    text-align: center!important;
}
.qty-up, .qty-down {
    cursor: pointer!important;
}
.text-center-cratos {
    /*position: absolute;*/
    bottom: 30px;
    text-align: center;
    color: red;
    cursor: pointer;
    width: 100%;
}
.product-details {
    text-align: right!important;
}

.qtd-input{
    width:80px!important;
}

/*.left-inner-addon {*/
/*    position: relative;*/
/*}*/

.left-inner-addon i {
    position: absolute;
    top: 55%;
    transform: translateY(-50%);
    padding: 4px 12px;
    pointer-events: none;
    font-size: 20px;
    display: none;
}

.left-inner-addon i.icon-error {
    right: 10px;
    color: red !important;
}

.left-inner-addon i.icon-success {
    right: 10px;
    color: var(--cor-principal) !important;
}

.left-inner-addon i.icon-visible {
    display: block;
}

.icon-error.icon-visible {
    display: block;
}

.icon-success.icon-visible {
    display: block;
}

.cepInvalido {
    border-color: red !important;
    box-shadow: 0 0 5px red !important;
}

.cepValido {
    border-color: var(--cor-principal) !important;
    box-shadow: 0 0 5px var(--cor-principal) !important;
}

input:focus {
    border-color: var(--cor-principal) !important;
    box-shadow: 0 0 5px var(--cor-principal) !important;
}

.btn-invalid {
    background-color: red !important;
    border-color: red !important;
    color: white !important;
}