/* Show it is fixed to the top */
body {
    min-height: 75rem;
    padding-top: 4.5rem;
}

.logo {
    max-height: 48px !important;
}

.bg-navbar {
    background-color: #512da8;
}
.text-dark-purple{
    color: #512da8
}
.bg-purple {
    background-color: #7533fa !important;
}

.btn-new {
    background-color: #4a148c;
    color: #fff;
    border-color: #4a148c;
}

.table-tmz thead th {
    background-color: #e8eaf6;
    padding-top: 15px;
    padding-bottom: 15px;
}

.table-tmz tbody tr td {
    font-size: .88em !important;
}

a, a:link, a:active {
    text-decoration: none;
}

.nav-item:hover {
    background-color: #4a148c;
    color: #fff;
}

li.sep:hover,
li.sep .nav-link {
    background-color: transparent;
    color: #fff;
    cursor: auto !important;

}

.nav-link {
    color: #fff !important;
}

img.logo-marca {
    filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0\'/></filter></svg>#grayscale"); /* Firefox 3.5+ */
    filter: gray; /* IE6-9 */
    -webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */
}

img.logo-marca:hover {
    filter: none;
    -webkit-filter: grayscale(0%);
    transform: scale(1.1); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
    cursor: pointer;

}

.card-img-top {
    width: auto;
    height: 15vw;
    object-fit: contain;
}

.marca-sel {
    border: 4px solid #6a1b9a !important;
    cursor: pointer;
    border-radius: 5px;
}

.marca-sel img {
    filter: none;
    -webkit-filter: grayscale(0%) !important;
    transform: scale(1.2);
}

.status-1 {
    background-color: #bbdefb !important;
    color: #000;
    font-size: .9em;
}

.status-2 {
    background-color: #b2dfdb !important;
    color: #000;
    font-size: .9em;
}

.status-2 {
    background-color: #b2dfdb !important;
    color: #000;
}

.status-3 {
    background-color: #2e7d32 !important;
    color: #fefefe;
    font-size: .9em;
}

.status-4 {
    background-color: #6d4c41 !important;
    color: #fff;
}

.status-5 {
    background-color: #546e7a !important;
    color: #fff;
}
.barra-adicionar {
    background-color: #f0f0f0;
    border-top: 1px solid #ddd;
    z-index: 1030;
}

.cart-float {
    position: fixed;
    right: 16px;
    bottom: 78px;
    z-index: 1040;
    font-size: 14px;
}
.cart-float-toggle {
    width: 56px;
    height: 56px;
    border: 0;
    border-radius: 50%;
    background: #512da8;
    color: #fff;
    box-shadow: 0 8px 20px rgba(81, 45, 168, .35);
    position: relative;
}
.cart-float-badge {
    position: absolute;
    top: -4px;
    right: -4px;
    background: #dc3545;
    color: #fff;
    border-radius: 999px;
    min-width: 22px;
    height: 22px;
    font-size: 11px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 6px;
}
.cart-float-panel {
    display: none;
    position: absolute;
    right: 0;
    bottom: 68px;
    width: 320px;
    max-height: 70vh;
    background: #fff;
    border: 1px solid #e5e5e5;
    border-radius: 12px;
    box-shadow: 0 12px 30px rgba(0,0,0,.18);
    overflow: hidden;
}
.cart-float-panel.open { display: flex; flex-direction: column; }
.cart-float-head {
    background: #512da8;
    color: #fff;
    padding: 10px 12px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.cart-float-body { overflow: auto; max-height: 46vh; padding: 8px 10px; }
.cart-float-marca {
    font-weight: 600;
    font-size: 12px;
    color: #512da8;
    margin: 6px 0 4px;
}
.cart-float-item { border-bottom: 1px solid #f0f0f0; padding: 6px 0; }
.cart-float-nome { font-size: 13px; }
.cart-float-meta { font-size: 12px; color: #666; }
.cart-float-foot { padding: 10px 12px; border-top: 1px solid #eee; background: #fafafa; }
@media (max-width: 576px) {
    .cart-float-panel { width: calc(100vw - 32px); }
}

/* Busca sempre visível no topo da loja */
.loja-topbar {
    display: contents;
}
.loja-search {
    flex: 1 1 auto;
    min-width: 0;
    max-width: 560px;
    margin: 0 .75rem;
}
.loja-search .form-control {
    border-color: transparent;
}
.loja-search .form-control:focus {
    box-shadow: 0 0 0 .2rem rgba(255, 193, 7, .35);
}

/* Menu colapsado (mobile/tablet) */
@media (max-width: 991.98px) {
    body {
        padding-top: 7.25rem;
    }
    .logo {
        max-height: 36px !important;
    }
    .loja-topbar {
        display: flex;
        width: 100%;
        align-items: center;
        justify-content: space-between;
    }
    .loja-search {
        flex: 0 0 100%;
        max-width: 100%;
        margin: .5rem 0 .25rem;
    }
    .nav-item.sep {
        display: none;
    }
    #navbarCollapse {
        background: rgba(0, 0, 0, .22);
        border-radius: 12px;
        padding: .75rem;
        margin-top: .5rem;
        box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .08);
    }
    #navbarCollapse .navbar-nav {
        gap: .25rem;
    }
    #navbarCollapse .nav-link {
        padding: .65rem .75rem;
        border-radius: 8px;
        display: flex;
        align-items: center;
        gap: .55rem;
    }
    #navbarCollapse .nav-link:hover {
        background: rgba(255, 255, 255, .12);
    }
    .loja-user {
        padding-top: .75rem;
        margin-top: .5rem;
        border-top: 1px dashed rgba(255, 255, 255, .35);
    }
}