/* ====================================================================
   iVALENEEXPRESS — UNIFORMIZAÇÃO DAS PÁGINAS INTERNAS
   --------------------------------------------------------------------
   Carrega por último. Harmoniza as páginas antigas (produto, categoria,
   lista, carrinho, login, contactos…) com o novo layout 2.0, mexendo
   SÓ em classes do tema antigo — nunca em .mkx-* — para não alterar a
   nova página inicial.
   ==================================================================== */

:root{
  --u-orange:#f26a1b; --u-orange-d:#d9531a; --u-navy:#0f1b2e;
  --u-ink:#1f2937; --u-muted:#64748b; --u-line:#e6e9ef; --u-bg:#f4f5f7;
  --u-blue:#2563eb;
}

/* Fundo e tipo de letra coerentes em todo o site */
body.mkx-body{ background:var(--u-bg) !important; color:var(--u-ink);
  font-family:'Roboto',system-ui,-apple-system,"Segoe UI",sans-serif; }

/* Largura útil das páginas internas igual à da home (quase às bermas) */
body.mkx-body .main-container.container,
body.mkx-body > .container{
  width:100% !important; max-width:1720px !important; min-width:0 !important;
  padding-left:24px !important; padding-right:24px !important; margin-left:auto !important; margin-right:auto !important;
}
@media (max-width:600px){
  body.mkx-body .main-container.container,
  body.mkx-body > .container{ padding-left:14px !important; padding-right:14px !important; }
}

/* ── Botões: a acção principal passa a laranja da marca ─────────────── */
body.mkx-body .btn-primary,
body.mkx-body .button-search.btn-primary,
body.mkx-body .btn.btn-primary{
  background:var(--u-orange) !important; border-color:var(--u-orange) !important; color:#fff !important;
}
body.mkx-body .btn-primary:hover,
body.mkx-body .btn.btn-primary:hover{ background:var(--u-orange-d) !important; border-color:var(--u-orange-d) !important; }
body.mkx-body .btn-default{ border-radius:8px; }
body.mkx-body .btn{ border-radius:8px; }

/* ── Títulos de secção (.modtitle) no estilo novo ──────────────────── */
body.mkx-body .module .modtitle,
body.mkx-body .module h3.modtitle{
  font-size:19px !important; font-weight:800 !important; color:var(--u-ink) !important;
  border:0 !important; position:relative; padding-bottom:12px; margin:8px 0 18px !important;
}
body.mkx-body .module .modtitle span{ background:none !important; padding:0 !important; color:inherit !important; }
body.mkx-body .module .modtitle::after{
  content:""; position:absolute; left:0; bottom:0; width:46px; height:3px;
  background:var(--u-orange); border-radius:2px;
}
body.mkx-body .module .modtitle .ver-todos{ float:right; font-size:13px; font-weight:600; color:var(--u-blue); }

/* ── Cartões de produto do tema (lista/categoria) harmonizados ─────── */
body.mkx-body .product-layout .product-item-container{
  background:#fff; border:1px solid var(--u-line); border-radius:12px; overflow:hidden;
  transition:box-shadow .15s, transform .15s; height:100%;
}
body.mkx-body .product-layout .product-item-container:hover{
  box-shadow:0 8px 24px rgba(16,27,46,.12); transform:translateY(-3px); border-color:transparent;
}
body.mkx-body .product-layout .caption h4{ font-size:13.5px; font-weight:600; }
body.mkx-body .product-layout .price .price-new{ color:var(--u-ink); font-weight:800; font-size:16px; }
body.mkx-body .product-layout .price .price-old{ color:#94a3b8; }
body.mkx-body .product-layout .label-product.label-sale{ background:#e03131; border-radius:6px; }
body.mkx-body .product-layout .addToCart,
body.mkx-body .product-layout .btn-button{ border-radius:8px; }

/* ── Breadcrumb / cabeçalho de página ──────────────────────────────── */
body.mkx-body .breadcrumb,
body.mkx-body .breadcrumbs{
  background:#fff !important; border:1px solid var(--u-line); border-radius:10px;
  padding:10px 16px !important; margin:0 0 20px !important; font-size:13px;
}
body.mkx-body .breadcrumb a, body.mkx-body .breadcrumbs a{ color:var(--u-blue); }

/* ── Painéis/caixas brancas coerentes ──────────────────────────────── */
body.mkx-body .box-content,
body.mkx-body .well,
body.mkx-body .panel{
  border-radius:12px; border:1px solid var(--u-line);
}

/* ── Título principal das páginas internas (h1) ────────────────────── */
body.mkx-body h1.mkx-h1{
  font-size:24px; font-weight:800; color:var(--u-ink); letter-spacing:-.01em;
  margin:0 0 18px;
}
@media (max-width:600px){
  body.mkx-body h1.mkx-h1{ font-size:20px; }
}

/* ── Cabeçalho de categoria (título grande das páginas de listagem) ── */
body.mkx-body .page-title,
body.mkx-body .title_block,
body.mkx-body h1.title{
  font-size:24px; font-weight:800; color:var(--u-ink); letter-spacing:-.01em;
}

/* ── Formulários (login, cadastro, contactos): caixa central limpa ─── */
body.mkx-body .login-content .well,
body.mkx-body .contact-form,
body.mkx-body form .form-group input.form-control,
body.mkx-body form .form-group textarea.form-control{ border-radius:9px; }

/* ── Filtros de listagem (barra de topo) ───────────────────────────── */
body.mkx-body .product-filter.filters-panel{
  background:#fff !important; border:1px solid var(--u-line) !important; border-radius:12px;
  padding:12px 16px !important; margin-bottom:18px;
}

/* Paginação */
body.mkx-body .pagination > li > a,
body.mkx-body .pagination > li > span{ color:var(--u-ink); border-radius:7px !important; margin:0 2px; }
body.mkx-body .pagination > .active > a,
body.mkx-body .pagination > .active > span{ background:var(--u-orange) !important; border-color:var(--u-orange) !important; }

/* ── Overflow horizontal: resolvido na origem, não escondido ───────────
   Nada de overflow-x:hidden/clip em html/body (isso apenas mascara o
   problema e torna conteúdo inacessível). O clip fica confinado aos
   carrosséis do tema, que são navegados por arrasto/botões e cujas setas
   são posicionadas absolutamente. */
body.mkx-body .owl2-stage-outer,
body.mkx-body .yt-content-slider,
body.mkx-body .so-extraslider{ overflow-x:clip; }
body.mkx-body{ max-width:100%; }
/* Itens directos da coluna flex do body não podem crescer acima do ecrã por
   causa do min-width:auto automático dos itens flex (tabelas largas). */
body.mkx-body > *{ min-width:0; max-width:100%; }

/* ── Página de categoria/subcategoria: usar a largura toda ──────────────
   O conteúdo vinha em col-sm-8 (66%), deixando um terço vazio à direita
   nos tablets, porque o tema previa uma barra lateral que não existe.
   Sem barra lateral, os produtos ocupam a largura completa. */
body.mkx-body #content.col-sm-8{ width:100% !important; float:none !important; }