/* ============================================================================
   MYTTA — CATALOGO (camada premium)
   Alinha a listagem a identidade da landing: fundo creme, cartoes brancos,
   selo de desconto ameixa e filtros discretos.
   ========================================================================== */

body.catalog-page .catalog-page-title,
body.catalog-page .products-page-title,
body.catalog-page .page-title,
body.catalog-page h1 {
    font-family: var(--mt-serif) !important;
    font-weight: 500 !important;
    font-size: clamp(1.9rem, 3.2vw, 2.9rem) !important;
    letter-spacing: 0 !important;
    text-transform: none !important;
    color: var(--mt-ink) !important;
}
body.catalog-page .breadcrumb,
body.catalog-page .catalog-breadcrumb {
    font-size: 0.7rem !important; letter-spacing: 0.06em !important; color: var(--mt-muted) !important;
}
body.catalog-page .breadcrumb a { color: var(--mt-muted) !important; }
body.catalog-page .breadcrumb a:hover { color: var(--mt-plum) !important; }

/* ------------------------------------------------------------ FILTROS --- */
body.catalog-page .filters-sidebar,
body.catalog-page .catalog-sidebar,
body.catalog-page .filters-panel {
    background: var(--mt-white) !important;
    border: 1px solid var(--mt-line-soft) !important;
    border-radius: 4px !important;
    box-shadow: var(--mt-shadow-xs) !important;
}
body.catalog-page .filter-title,
body.catalog-page .filters-sidebar h3,
body.catalog-page .filter-group-title {
    font-size: 0.66rem !important; font-weight: 600 !important;
    letter-spacing: 0.18em !important; text-transform: uppercase !important;
    color: var(--mt-ink) !important;
}
body.catalog-page .filters-sidebar label,
body.catalog-page .filter-option label {
    font-size: 0.8rem !important; color: var(--mt-ink-soft) !important;
}
body.catalog-page .filters-sidebar input[type="checkbox"] { accent-color: var(--mt-plum); }
body.catalog-page .filters-sidebar input[type="number"],
body.catalog-page .filters-sidebar input[type="text"],
body.catalog-page .filters-sidebar select,
body.catalog-page .catalog-search-input,
body.catalog-page .sort-select {
    border: 1px solid var(--mt-line) !important;
    border-radius: 2px !important;
    font-family: var(--mt-sans) !important;
    color: var(--mt-ink) !important;
    background: var(--mt-white) !important;
}
body.catalog-page .filters-sidebar input:focus,
body.catalog-page .catalog-search-input:focus,
body.catalog-page .sort-select:focus {
    outline: none !important; border-color: var(--mt-plum) !important;
    box-shadow: 0 0 0 3px rgba(138,107,135,0.14) !important;
}
body.catalog-page .btn-apply-filter,
body.catalog-page .filters-apply-btn {
    background: var(--mt-plum) !important; color: var(--mt-white) !important;
    border: 0 !important; border-radius: 2px !important;
    font-size: 0.68rem !important; font-weight: 600 !important;
    letter-spacing: 0.14em !important; text-transform: uppercase !important;
    transition: background-color .4s var(--mt-ease-out) !important;
}
body.catalog-page .btn-apply-filter:hover,
body.catalog-page .filters-apply-btn:hover { background: var(--mt-plum-deep) !important; }

/* ------------------------------------------------------------ PAGINACAO - */
body.catalog-page .pagination a,
body.catalog-page .pagination button {
    border: 1px solid var(--mt-line) !important; border-radius: 2px !important;
    color: var(--mt-ink-soft) !important; background: var(--mt-white) !important;
}
body.catalog-page .pagination .active,
body.catalog-page .pagination a.is-active {
    background: var(--mt-plum) !important; color: var(--mt-white) !important;
    border-color: var(--mt-plum) !important;
}

/* -------------------------------------------- REFORCO DE CONVERSAO ------ */
/* Barra de garantias no topo da listagem: quem chega por busca nao conhece a
   marca e decide pelo risco percebido. */
.mt-catalog-assurance {
    max-width: var(--mt-shell); margin: 0 auto clamp(1rem, 2vw, 1.75rem);
    padding-inline: var(--mt-gutter);
}
.mt-catalog-assurance .mt-assurance-item { background: var(--mt-white); }

/* ------------------------------- BARRA DE FILTROS / BUSCA DO CATALOGO --- */
/* O tema herdado era azul-marinho (#103070) com foco amarelo (#F0E000):
   nada disso pertence a paleta da marca. */
body.catalog-page .top-toolbar-search-input,
body.catalog-page .top-toolbar-select,
body.catalog-page .top-toolbar-dropdown-btn,
body.catalog-page .top-toolbar-dropdown-search input {
    border: 1px solid var(--mt-line) !important;
    background: var(--mt-white) !important;
    color: var(--mt-ink) !important;
    font-family: var(--mt-sans) !important;
    border-radius: 2px !important;
}
body.catalog-page .top-toolbar-search-input::placeholder,
body.catalog-page .top-toolbar-dropdown-search input::placeholder {
    color: var(--mt-muted) !important;
}
body.catalog-page .top-toolbar-search-input:focus,
body.catalog-page .catalog-grid-filters .top-toolbar-search-input:focus,
body.catalog-page .top-toolbar-select:focus,
body.catalog-page .top-toolbar-select:hover,
body.catalog-page .top-toolbar-dropdown-search input:focus {
    outline: none !important;
    border-color: var(--mt-plum) !important;
    box-shadow: 0 0 0 3px rgba(138,107,135,0.16) !important;
}
body.catalog-page .top-toolbar-search-icon,
body.catalog-page .top-toolbar-select-icon,
body.catalog-page .top-toolbar-dropdown-search i { color: var(--mt-plum) !important; opacity: 0.7 !important; }
body.catalog-page .top-toolbar-apply,
body.catalog-page .catalog-price-apply {
    background: var(--mt-plum) !important; color: var(--mt-white) !important;
    border: 0 !important; border-radius: 2px !important;
    font-size: 0.68rem !important; font-weight: 600 !important;
    letter-spacing: 0.12em !important; text-transform: uppercase !important;
}
body.catalog-page .top-toolbar-apply:hover,
body.catalog-page .catalog-price-apply:hover { background: var(--mt-plum-deep) !important; }
body.catalog-page .top-toolbar-clear {
    background: transparent !important; color: var(--mt-muted) !important;
    border: 1px solid var(--mt-line) !important; border-radius: 2px !important;
}
body.catalog-page .top-toolbar-dropdown-list label { color: var(--mt-ink-soft) !important; }
body.catalog-page .top-toolbar-dropdown-list input[type="checkbox"] { accent-color: var(--mt-plum); }

/* A faixa de garantias passa a viver no meio da grade */
.mt-catalog-assurance--inline {
    grid-column: 1 / -1;
    margin: clamp(0.75rem, 2vw, 1.5rem) 0;
    padding-inline: 0;
}
.mt-catalog-assurance--inline .mt-assurance-item {
    background: var(--mt-sand);
    border-color: var(--mt-line-soft);
}

/* ------------------------------------------- ENQUADRAMENTO DA SIDEBAR --- */
body.catalog-page .catalog-grid-filters {
    background: var(--mt-white);
    border: 1px solid var(--mt-line-soft);
    border-radius: 4px;
    padding: clamp(1rem, 1.4vw, 1.4rem) !important;
    gap: 1.35rem !important;
}
body.catalog-page .catalog-grid-filters .top-toolbar-group { gap: 0.6rem !important; }
body.catalog-page .catalog-grid-filters label,
body.catalog-page .catalog-grid-filters .top-toolbar-dropdown-list label {
    display: flex !important; align-items: flex-start; gap: 0.55rem;
    padding: 0.3rem 0 !important; line-height: 1.45 !important;
    font-size: 0.78rem !important; cursor: pointer;
}
body.catalog-page .catalog-grid-filters input[type="checkbox"] {
    margin-top: 0.15rem; flex: 0 0 auto; width: 15px; height: 15px;
}
body.catalog-page .catalog-price-fields { gap: 0.5rem !important; }
body.catalog-page .catalog-price-apply { padding: 0.55rem 1rem !important; }

/* Contador e ordenacao do topo alinhados com a grade */
body.catalog-page .top-toolbar-count,
body.catalog-page .products-count {
    font-size: 0.75rem !important; color: var(--mt-muted) !important;
    letter-spacing: 0.04em !important;
}

/* Categorias (departamentos) — imagem preenchendo todo o card circular */
body.catalog-page .department-image-container {
    padding: 0;
}
body.catalog-page .department-image {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}


/* ------------------------------------------- FAIXA DA TOALHA (grade) -- */
/* Quem esta na grade ainda nao abriu anuncio nenhum e ja quer saber que
   toalha e essa. Mesma fonte de dados da ficha da pagina do produto. */
.mt-towel-band { grid-column: 1 / -1; margin: clamp(1.25rem, 2.5vw, 2rem) 0; }
.mt-towel-band-inner {
    background: linear-gradient(100deg, var(--mt-sand, #ECE7E3) 0%, #F3EBF1 46%, var(--mt-lilac, #D9C7D4) 100%);
    border: 1px solid var(--mt-line-soft, #ECE3E6); border-radius: 4px;
    padding: clamp(1.1rem, 2.4vw, 1.75rem) clamp(1.1rem, 2.4vw, 2rem);
}
.mt-towel-band-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.5rem 0.9rem; margin-bottom: 0.85rem; }
.mt-towel-band-head strong { font-family: var(--mt-serif, serif); font-size: clamp(1.05rem, 2vw, 1.35rem); font-weight: 500; color: var(--mt-ink, #2B2A28); }
.mt-towel-band-head span { font-size: 0.74rem; letter-spacing: 0.06em; color: var(--mt-plum, #7B4361); }
.mt-towel-band ul {
    list-style: none; margin: 0 0 0.85rem; padding: 0;
    display: flex; flex-wrap: wrap; gap: 0.5rem 1.75rem;
}
.mt-towel-band ul li { display: flex; align-items: baseline; gap: 0.4rem; font-size: 0.82rem; color: var(--mt-ink, #2B2A28); }
.mt-towel-band ul li strong { font-weight: 600; }
.mt-towel-band ul li span { color: var(--mt-ink-soft, #6B6560); }
.mt-towel-band p { margin: 0; font-size: 0.8rem; line-height: 1.65; color: var(--mt-ink-soft, #6B6560); max-width: 78ch; }