/*
|--------------------------------------------------------------------------
| MODULO: Design System Marketplace
| VERSAO: 1.0
| DESCRICAO: Base visual premium, responsiva e reutilizavel do bazar.
|--------------------------------------------------------------------------
*/

:root {
    --bz-font: "Manrope", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    --bz-bg: #f3f6fb;
    --bz-surface: #ffffff;
    --bz-surface-alt: #eef3fb;
    --bz-border: #dce5f2;
    --bz-text: #172033;
    --bz-text-soft: #617089;
    --bz-primary: #0f5bd7;
    --bz-primary-dark: #0a44a1;
    --bz-accent: #ff7a1a;
    --bz-success: #0f9d68;
    --bz-danger: #d92d20;
    --bz-warning: #f59e0b;
    --bz-radius: 18px;
    --bz-shadow: 0 18px 40px rgba(17, 34, 68, 0.08);
}

html, body {
    background: var(--bz-bg);
    color: var(--bz-text);
    font-family: var(--bz-font);
}

.bazar-shell {
    max-width: 1380px;
}

.bazar-main {
    min-height: 60vh;
}

.market-topbar {
    background: linear-gradient(90deg, #0e1b32 0%, #16315b 100%);
    color: #fff;
    font-size: .92rem;
}

.market-topbar__row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    min-height: 42px;
}

.market-topbar__message,
.market-topbar__links,
.market-topbar__links a {
    display: flex;
    align-items: center;
    gap: .85rem;
}

.market-topbar__message {
    gap: .65rem;
    min-width: 0;
}

.market-topbar__message span {
    font-weight: 700;
}

.market-topbar__pill {
    font-style: normal;
    font-size: .8rem;
    color: rgba(255,255,255,.78);
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 999px;
    padding: .22rem .65rem;
    white-space: nowrap;
}

.market-topbar__links a {
    color: rgba(255,255,255,.88);
    text-decoration: none;
    min-height: 32px;
    padding: 0 .2rem;
}

.market-header {
    position: sticky;
    top: 0;
    z-index: 1040;
    background: rgba(255,255,255,.92);
    backdrop-filter: blur(14px);
    border-bottom: 1px solid rgba(220,229,242,.9);
    transition: box-shadow .25s ease, transform .25s ease;
}

.market-header.is-scrolled {
    box-shadow: 0 12px 28px rgba(17, 34, 68, .09);
}

.market-header__main {
    display: grid;
    grid-template-columns: auto auto minmax(320px, 1fr) auto;
    gap: 1rem;
    align-items: center;
    min-height: 88px;
}

.market-logo img {
    max-height: 52px;
    width: auto;
    display: block;
}

.market-header__delivery {
    display: flex;
    flex-direction: column;
    gap: .2rem;
    min-width: 156px;
}

.market-header__delivery-label {
    color: var(--bz-text-soft);
    font-size: .76rem;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.market-header__delivery-trigger {
    border: 0;
    background: transparent;
    padding: 0;
    display: inline-flex;
    align-items: center;
    gap: .55rem;
    color: var(--bz-text);
    font-size: .95rem;
    text-align: left;
}

.market-search {
    position: relative;
    display: flex;
    align-items: center;
}

.market-search input {
    width: 100%;
    height: 56px;
    border-radius: 999px;
    border: 1px solid var(--bz-border);
    padding: 0 68px 0 22px;
    background: var(--bz-surface-alt);
    outline: 0;
}

.market-search button {
    position: absolute;
    right: 8px;
    width: 42px;
    height: 42px;
    border-radius: 50%;
    border: 0;
    background: var(--bz-primary);
    color: #fff;
}

.market-actions {
    display: flex;
    align-items: center;
    gap: .75rem;
}

.market-action,
.market-cart-button {
    display: inline-flex;
    align-items: center;
    gap: .75rem;
    border: 1px solid var(--bz-border);
    border-radius: 999px;
    background: #fff;
    color: var(--bz-text);
    padding: .7rem 1rem;
    text-decoration: none;
}

.market-action i,
.market-cart-button i,
.market-icon-button i {
    font-size: 1.3rem;
}

.market-action > span,
.market-cart-button > span {
    display: flex;
    flex-direction: column;
    line-height: 1.1;
    min-width: 0;
}

.market-action small,
.market-cart-button small {
    color: var(--bz-text-soft);
    font-size: .72rem;
}

.market-action strong,
.market-cart-button strong {
    white-space: nowrap;
}

.market-action--favorites {
    min-width: 172px;
}

.market-action--favorites strong {
    display: inline-flex;
    align-items: center;
    gap: .2rem;
    flex-wrap: nowrap;
}

[data-favorite-count] {
    display: inline-block;
}

.market-cart-button {
    position: relative;
    cursor: pointer;
}

.market-cart-count {
    min-width: 24px;
    height: 24px;
    border-radius: 50%;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: var(--bz-accent);
    color: #fff;
    font-style: normal;
    font-size: .78rem;
    font-weight: 700;
}

.market-header__nav {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: .8rem 0 1rem;
}

.market-nav-links {
    display: flex;
    align-items: center;
    gap: .6rem;
    overflow-x: auto;
    scrollbar-width: none;
}

.market-nav-links::-webkit-scrollbar {
    display: none;
}

.market-nav-links a,
.market-departments__trigger {
    display: inline-flex;
    align-items: center;
    gap: .5rem;
    text-decoration: none;
    border: 1px solid var(--bz-border);
    background: #fff;
    color: var(--bz-text);
    min-height: 42px;
    padding: 0 1rem;
    border-radius: 999px;
    white-space: nowrap;
}

.market-departments {
    position: relative;
}

.market-departments__menu {
    position: absolute;
    top: calc(100% + 12px);
    left: 0;
    width: min(780px, 80vw);
    background: #fff;
    border-radius: 22px;
    box-shadow: var(--bz-shadow);
    border: 1px solid var(--bz-border);
    padding: 1rem;
    display: none;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .75rem;
}

.market-departments.is-open .market-departments__menu {
    display: grid;
}

.market-department-item {
    border: 1px solid var(--bz-border);
    border-radius: 16px;
    padding: .85rem;
    background: var(--bz-surface-alt);
}

.market-department-item > a,
.market-department-children a {
    display: block;
    color: var(--bz-text);
    text-decoration: none;
}

.market-department-item > a small {
    color: var(--bz-text-soft);
    display: block;
    margin-top: .2rem;
}

.market-department-children {
    margin-top: .65rem;
    display: grid;
    gap: .35rem;
}

.market-mobile-only {
    display: none;
}

.market-mobile-nav,
.market-minicart,
.market-cep-modal {
    position: fixed;
    inset: 0;
    z-index: 1080;
}

.market-mobile-nav__backdrop,
.market-minicart__backdrop,
.market-cep-modal__backdrop {
    position: absolute;
    inset: 0;
    background: rgba(15, 23, 42, .55);
}

.market-mobile-nav__panel,
.market-minicart__panel,
.market-cep-modal__panel {
    position: absolute;
    top: 0;
    right: 0;
    width: min(420px, 92vw);
    height: 100%;
    background: #fff;
    box-shadow: var(--bz-shadow);
    display: flex;
    flex-direction: column;
}

.market-mobile-nav__header,
.market-minicart__header,
.market-cep-modal__header {
    min-height: 72px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 1.25rem;
    border-bottom: 1px solid var(--bz-border);
}

.market-mobile-nav__header button,
.market-minicart__header button,
.market-cep-modal__header button,
.market-icon-button {
    border: 0;
    background: #fff;
    width: 44px;
    height: 44px;
    border-radius: 50%;
}

.market-mobile-nav__content,
.market-minicart__body {
    padding: 1rem 1.25rem;
    overflow: auto;
}

.market-mobile-nav__content a {
    display: block;
    padding: .85rem 0;
    text-decoration: none;
    color: var(--bz-text);
    border-bottom: 1px solid rgba(220,229,242,.7);
}

.market-mobile-nav__group + .market-mobile-nav__group {
    margin-top: .85rem;
}

.market-cep-form {
    padding: 1rem 1.25rem;
    display: grid;
    gap: .85rem;
}

.market-cep-form__row {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: .65rem;
}

.market-cep-form__actions {
    display: flex;
    justify-content: flex-start;
}

.market-cep-form__remember {
    display: flex;
    align-items: center;
    gap: .65rem;
    margin-top: .85rem;
    color: #475569;
    font-size: .92rem;
}

.market-cep-form__remember input {
    width: 1rem;
    height: 1rem;
    accent-color: var(--bz-accent);
}

.market-cep-feedback {
    min-height: 18px;
}

.market-cep-form input {
    height: 52px;
    border-radius: 14px;
    border: 1px solid var(--bz-border);
    padding: 0 1rem;
}

.market-cep-form button {
    border: 0;
    border-radius: 14px;
    padding: 0 1.15rem;
    background: var(--bz-primary);
    color: #fff;
}

.market-minicart__footer {
    border-top: 1px solid var(--bz-border);
    padding: 1rem 1.25rem 1.25rem;
    display: grid;
    gap: 1rem;
}

.market-minicart__summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.market-minicart__actions {
    display: grid;
    gap: .75rem;
}

.market-minicart__item {
    display: grid;
    grid-template-columns: 72px 1fr;
    gap: .9rem;
    padding: .85rem 0;
    border-bottom: 1px solid rgba(220,229,242,.7);
}

.market-minicart__item img {
    width: 72px;
    height: 72px;
    border-radius: 14px;
    object-fit: cover;
    background: var(--bz-surface-alt);
}

.market-minicart__item h6 {
    font-size: .95rem;
    margin-bottom: .25rem;
}

.market-minicart__item small {
    color: var(--bz-text-soft);
    display: block;
}

.market-trust {
    padding: 1.2rem 0 0;
}

.market-trust__grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.market-trust__item {
    background: #fff;
    border-radius: 20px;
    border: 1px solid var(--bz-border);
    box-shadow: var(--bz-shadow);
    padding: 1rem 1.1rem;
    display: flex;
    gap: .85rem;
}

.market-trust__item i {
    font-size: 1.4rem;
    color: var(--bz-primary);
}

.market-trust__item strong,
.market-footer h4,
.market-footer h5 {
    display: block;
    margin-bottom: .25rem;
}

.market-trust__item span,
.market-footer p,
.market-footer a,
.market-footer__bottom {
    color: var(--bz-text-soft);
}

.market-footer {
    margin-top: 2rem;
    padding: 2.5rem 0 1.5rem;
    background: linear-gradient(180deg, #0f172a 0%, #111d35 100%);
    color: #fff;
}

.market-footer__grid {
    display: grid;
    grid-template-columns: 1.6fr 1fr 1fr 1fr;
    gap: 1.5rem;
}

.market-footer h4,
.market-footer h5 {
    color: #fff;
}

.market-footer a {
    display: block;
    text-decoration: none;
    margin-bottom: .55rem;
}

.market-footer__badges,
.market-footer__socials {
    display: flex;
    flex-wrap: wrap;
    gap: .6rem;
}

.market-footer__badges span,
.market-footer__socials a {
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 999px;
    padding: .5rem .85rem;
    color: #fff;
}

.market-footer__bottom {
    margin-top: 2rem;
    padding-top: 1.2rem;
    border-top: 1px solid rgba(255,255,255,.12);
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    font-size: .92rem;
}

.market-whatsapp-float {
    position: fixed;
    right: 18px;
    bottom: 18px;
    width: 58px;
    height: 58px;
    border-radius: 50%;
    background: #20c863;
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.75rem;
    text-decoration: none;
    box-shadow: 0 18px 30px rgba(32, 200, 99, .28);
    z-index: 1050;
}

.market-catalog {
    padding: 1.5rem 0 2rem;
}

.market-breadcrumbs {
    display: flex;
    align-items: center;
    gap: .45rem;
    flex-wrap: wrap;
    font-size: .9rem;
    margin-bottom: 1rem;
}

.market-breadcrumbs a {
    color: var(--bz-text-soft);
    text-decoration: none;
}

.market-page-head {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: flex-end;
    margin-bottom: 1.4rem;
}

.market-page-head h1 {
    font-size: clamp(1.7rem, 2.5vw, 2.3rem);
    margin: 0;
}

.market-page-head p {
    color: var(--bz-text-soft);
    margin: .35rem 0 0;
}

.market-toolbar,
.market-filters,
.market-card,
.market-summary-card {
    background: #fff;
    border: 1px solid var(--bz-border);
    border-radius: 22px;
    box-shadow: var(--bz-shadow);
}

.market-toolbar {
    padding: 1rem 1.1rem;
    display: flex;
    justify-content: space-between;
    gap: 1rem;
    align-items: center;
    margin-bottom: 1rem;
}

.market-toolbar__controls {
    display: flex;
    gap: .75rem;
    align-items: center;
    flex-wrap: wrap;
}

.market-toolbar select,
.market-toolbar input,
.market-filters input,
.market-filters select {
    border: 1px solid var(--bz-border);
    border-radius: 14px;
    min-height: 44px;
    padding: 0 .9rem;
}

.market-filters {
    padding: 1rem;
    position: sticky;
    top: 120px;
}

.market-filters h5 {
    margin-bottom: 1rem;
}

.market-filters .filter-block + .filter-block {
    margin-top: 1rem;
    padding-top: 1rem;
    border-top: 1px solid rgba(220,229,242,.8);
}

.market-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 1rem;
}

.market-card {
    overflow: hidden;
    height: 100%;
    display: flex;
    flex-direction: column;
    transition: transform .22s ease, box-shadow .22s ease;
}

.market-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 24px 44px rgba(17,34,68,.12);
}

.market-card__media {
    position: relative;
    background: linear-gradient(180deg, #f8fbff 0%, #ecf2fb 100%);
    height: 220px;
    flex: 0 0 220px;
}

.market-card__media img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: .75rem;
}

.market-card__badge-row {
    position: absolute;
    top: .85rem;
    left: .85rem;
    display: flex;
    gap: .45rem;
    flex-wrap: wrap;
}

.market-badge {
    border-radius: 999px;
    padding: .35rem .65rem;
    font-size: .72rem;
    font-weight: 800;
}

.market-badge--offer { background: rgba(217,45,32,.95); color: #fff; }
.market-badge--new { background: rgba(15,157,104,.12); color: var(--bz-success); }
.market-badge--stock { background: rgba(245,158,11,.14); color: #9a6700; }
.market-badge--muted { background: rgba(23,32,51,.08); color: var(--bz-text-soft); }
.market-badge--premium { background: linear-gradient(135deg, #0f5bd7 0%, #1d8fff 100%); color: #fff; }

.market-card__body {
    padding: .9rem;
    display: grid;
    gap: .55rem;
    flex: 1 1 auto;
    align-content: start;
}

.market-card__meta {
    display: flex;
    justify-content: space-between;
    gap: .75rem;
    align-items: center;
    color: var(--bz-text-soft);
    font-size: .76rem;
}

.market-card__title {
    color: var(--bz-text);
    text-decoration: none;
    font-weight: 700;
    line-height: 1.4;
    min-height: 2.8em;
    font-size: .95rem;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.market-card__description {
    color: var(--bz-text-soft);
    font-size: .78rem;
    line-height: 1.45;
    min-height: 2.15em;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.market-rating {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    font-size: .82rem;
}

.market-price-old {
    color: #8a97aa;
    text-decoration: line-through;
    font-size: .88rem;
}

.market-price-current {
    font-size: 1.12rem;
    font-weight: 800;
    color: var(--bz-primary-dark);
    line-height: 1.1;
}

.market-price-installment,
.market-card__delivery {
    color: var(--bz-text-soft);
    font-size: .76rem;
}

.market-card__highlights {
    display: flex;
    flex-wrap: wrap;
    gap: .45rem;
}

.market-highlight {
    display: inline-flex;
    align-items: center;
    min-height: 28px;
    padding: .28rem .58rem;
    border-radius: 999px;
    font-size: .7rem;
    font-weight: 700;
    line-height: 1.15;
    border: 1px solid transparent;
}

.market-highlight--premium {
    background: rgba(15, 91, 215, .08);
    border-color: rgba(15, 91, 215, .14);
    color: var(--bz-primary-dark);
}

.market-highlight--offer {
    background: rgba(217, 45, 32, .08);
    border-color: rgba(217, 45, 32, .14);
    color: #b42318;
}

.market-highlight--stock {
    background: rgba(245, 158, 11, .14);
    border-color: rgba(245, 158, 11, .18);
    color: #9a6700;
}

.market-highlight--stock-soft {
    background: rgba(253, 230, 138, .2);
    border-color: rgba(245, 158, 11, .16);
    color: #8a5a00;
}

.market-highlight--warm {
    background: rgba(17, 24, 39, .06);
    border-color: rgba(17, 24, 39, .08);
    color: #374151;
}

.market-highlight--neutral {
    background: rgba(15, 157, 104, .08);
    border-color: rgba(15, 157, 104, .12);
    color: #0f7d54;
}

.market-card__actions {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: .5rem;
    margin-top: .2rem;
}

.market-card__actions .btn {
    border-radius: 14px;
    min-height: 38px;
    font-weight: 700;
    font-size: .8rem;
}

.market-card__actions .btn-primary {
    box-shadow: 0 10px 22px rgba(15, 91, 215, .18);
}

.market-card__actions .btn-outline-secondary {
    min-width: 98px;
}

.market-card__utility {
    display: flex;
    gap: .45rem;
    align-items: center;
}

.market-utility-btn {
    width: 36px;
    height: 36px;
    border-radius: 12px;
    border: 1px solid var(--bz-border);
    background: #fff;
    color: var(--bz-text-soft);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transition: all .2s ease;
}

.market-utility-btn:hover {
    color: var(--bz-primary);
    border-color: rgba(15, 91, 215, .32);
    background: rgba(15, 91, 215, .05);
}

.market-utility-btn.is-active {
    color: #d92d20;
    border-color: rgba(217, 45, 32, .25);
    background: rgba(217, 45, 32, .08);
}

.market-pagination {
    display: flex;
    justify-content: center;
    gap: .5rem;
    flex-wrap: wrap;
    margin-top: 1.4rem;
}

.market-pagination a,
.market-pagination span {
    min-width: 42px;
    height: 42px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 12px;
    border: 1px solid var(--bz-border);
    background: #fff;
    color: var(--bz-text);
    text-decoration: none;
}

.market-pagination .is-active {
    background: var(--bz-primary);
    border-color: var(--bz-primary);
    color: #fff;
}

.market-empty-state,
.market-summary-card {
    padding: 1.25rem;
}

.market-summary-card {
    position: sticky;
    top: 124px;
}

.market-skeleton {
    border-radius: 14px;
    background: linear-gradient(90deg, #eef2f7 25%, #f7f9fc 37%, #eef2f7 63%);
    background-size: 400% 100%;
    animation: bazarSkeleton 1.4s ease infinite;
}

.market-skeleton--line {
    height: 72px;
    margin-bottom: .8rem;
}

@keyframes bazarSkeleton {
    0% { background-position: 100% 50%; }
    100% { background-position: 0 50%; }
}

@media (max-width: 1199.98px) {
    .market-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .market-footer__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 991.98px) {
    .market-desktop-only { display: none !important; }
    .market-mobile-only { display: inline-flex; }
    .market-topbar__links { display: none; }
    .market-header__main { grid-template-columns: auto auto 1fr auto; min-height: 76px; }
    .market-logo img { max-height: 44px; }
    .market-search { grid-column: 1 / -1; order: 5; margin-bottom: .9rem; }
    .market-header__main { padding: .9rem 0; }
    .market-header__nav { padding-top: 0; }
    .market-nav-links { padding-bottom: .35rem; }
    .market-trust__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .market-toolbar { flex-direction: column; align-items: stretch; }
    .market-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .market-filters { position: static; }
}

@media (max-width: 767.98px) {
    .market-topbar__message { font-size: .84rem; }
    .market-action span { display: none; }
    .market-action,
    .market-cart-button,
    .market-icon-button { width: 46px; height: 46px; justify-content: center; padding: 0; }
    .market-cart-count { position: absolute; top: -4px; right: -4px; }
    .market-page-head { flex-direction: column; align-items: flex-start; }
    .market-trust__grid,
    .market-footer__grid { grid-template-columns: 1fr; }
    .market-footer__bottom { flex-direction: column; }
}

@media (max-width: 575.98px) {
    .market-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .85rem; }
    .market-card__body { padding: .85rem; }
    .market-card__actions { grid-template-columns: 1fr; }
    .market-card__description { font-size: .76rem; }
    .market-price-current { font-size: 1.05rem; }
    .market-card__actions .btn { min-height: 40px; font-size: .82rem; }
    .market-card__media { height: 168px; flex-basis: 168px; }
    .market-topbar { display: none; }
}

.product-detail-container .card,
#comments-list .card,
.shipping-box,
.cart-item-row,
#resumo-pedido,
.list-group-item,
.section-shell,
.category-shell {
    border-color: var(--bz-border) !important;
}

.product-detail-container .card {
    border-radius: 24px;
    box-shadow: var(--bz-shadow);
}

.product-detail-container h1 {
    font-size: clamp(1.8rem, 2.8vw, 2.7rem);
}

.product-detail-container #preco-atual-display {
    font-size: clamp(2rem, 3.2vw, 2.8rem);
}

.product-detail-container .carousel-item img,
.product-detail-container .carousel-item video {
    border-radius: 24px;
    background: linear-gradient(180deg, #f8fbff 0%, #edf3fb 100%);
}

.product-detail-container .form-select,
.product-detail-container .form-control,
.shipping-box .form-control {
    min-height: 50px;
    border-radius: 14px;
}

.shipping-box {
    background: linear-gradient(180deg, #ffffff 0%, #f7fafe 100%) !important;
}

#comments-list .card {
    border-radius: 18px;
}

.cart-item-row {
    border-radius: 20px !important;
    border: 1px solid var(--bz-border);
    background: #fff !important;
}

#lista-carrinho .btn,
#resumo-pedido .btn,
.shipping-box .btn,
.product-detail-container .btn {
    border-radius: 14px;
}

.super-home .section-shell,
.super-home .category-shell {
    border: 1px solid var(--bz-border);
}