:root{
      --col-blue:#0a4ed6;
      --col-blue-dark:#083a9e;
      --col-red:#e10600;
      --col-black:#0a0a0a;
      --col-text:#0f1111;
      --col-muted:#565959;
      --col-link:#007185;
      --col-link-hover:#c7511f;
      --col-price:#0a0a0a;
      --col-bg:#f3f3f3;
      --col-border:#e7e7e7;
      --col-yellow:#ffa41c;
      --col-green:#067d62;
      --col-card:#ffffff;
    }
    *{box-sizing:border-box;}
    body{margin:0;font-family:"Amazon Ember","Segoe UI",Roboto,Arial,sans-serif;color:var(--col-text);background:var(--col-bg);}
    #produtos-page{padding:18px 0 40px;}
    .produtos-container{
      max-width:1500px;
      margin:0 auto;
      padding:0 18px;
    }
    .produtos-breadcrumb{
      font-size:13px;
      color:var(--col-muted);
      margin-bottom:14px;
    }
    .produtos-breadcrumb a{color:var(--col-link);text-decoration:none;}
    .produtos-breadcrumb a:hover{color:var(--col-link-hover);text-decoration:underline;}
    .cat-row{
      background:var(--col-card);
      border:1px solid var(--col-border);
      border-radius:8px;
      padding:18px 20px 22px;
      margin-bottom:20px;
      position:relative;
    }
    .cat-row-header{
      display:flex;
      align-items:baseline;
      gap:14px;
      margin-bottom:14px;
      flex-wrap:wrap;
    }
    .cat-row-header h2{
      font-size:21px;
      font-weight:700;
      color:var(--col-text);
      margin:0;
      letter-spacing:-.2px;
    }
    .cat-row-header a.ver-mais{
      font-size:13px;
      color:var(--col-link);
      text-decoration:none;
    }
    .cat-row-header a.ver-mais:hover{color:var(--col-link-hover);text-decoration:underline;}
    .cat-scroll-wrap{position:relative;}
    .cat-scroll{
      display:grid;
      grid-auto-flow:column;
      grid-auto-columns:calc((100% - 75px) / 6);
      gap:15px;
      overflow-x:auto;
      overflow-y:hidden;
      scroll-behavior:smooth;
      scroll-snap-type:x mandatory;
      padding-bottom:6px;
    }
    .cat-scroll::-webkit-scrollbar{height:6px;}
    .cat-scroll::-webkit-scrollbar-thumb{background:#ccc;border-radius:4px;}
    @media (max-width:1200px){.cat-scroll{grid-auto-columns:calc((100% - 60px) / 5);}}
    @media (max-width:992px){.cat-scroll{grid-auto-columns:calc((100% - 45px) / 4);}}
    @media (max-width:768px){.cat-scroll{grid-auto-columns:calc((100% - 30px) / 3);}}
    @media (max-width:560px){.cat-scroll{grid-auto-columns:calc((100% - 15px) / 2);}}

    .prod-card{
      scroll-snap-align:start;
      display:flex;
      flex-direction:column;
      background:#fff;
      text-decoration:none;
      color:inherit;
      height: 100%;
    }
    .prod-card .img-box{
      aspect-ratio:1/1;
      background:#fafafa;
      border-radius:4px;
      display:flex;
      align-items:center;
      justify-content:center;
      overflow:hidden;
      margin-bottom:10px;
      position:relative;
    }
    .prod-card .img-box img{
      max-width:90%;
      max-height:90%;
      object-fit:contain;
      transition:transform .25s ease;
    }
    .prod-card:hover .img-box img{transform:scale(1.04);}
    .badge-oficial{
      position:absolute;
      top:8px;
      right:8px;
      background:#fff;
      border:1px solid var(--col-border);
      border-radius:50%;
      width:46px;
      height:46px;
      display:flex;
      align-items:center;
      justify-content:center;
      font-size:9px;
      font-weight:700;
      text-align:center;
      color:var(--col-blue);
      line-height:1.05;
      padding:4px;
      box-shadow:0 1px 3px rgba(0,0,0,.08);
    }
    .prod-title{
      font-size:16px;
      line-height:1.35;
      color:var(--col-text);
      margin:0 0 4px;
      font-weight:400;
      display:-webkit-box;
      -webkit-line-clamp:2;
      -webkit-box-orient:vertical;
      overflow:hidden;
      min-height:38px;
      padding-left:6px;
    }
    .prod-card:hover .prod-title{color:var(--col-link-hover);}
    .prod-rating{
      display:flex;
      align-items:center;
      gap:6px;
      font-size:13px;
      margin-bottom:4px;
      padding-left:6px;
    }
    .rating-num{color:var(--col-text);font-weight:500;}
    .badge-oferta{
      background: #d12626;;
      color:#fff;
      font-size:12px;
      font-weight:700;
      padding:5px 8px;
      border-radius:2px;
      text-transform:uppercase;
      width:max-content;
      margin-left:6px;
    }
    .prod-preco { margin: 12px 0 12px; line-height: 1; padding-left:6px; font-size: 25px; font-weight: 500;}
    .preco-symbol { font-size: 15px; vertical-align: top; position: relative; top: 4px; margin-right: 5px; }
    .preco-int-antigo { font-size: 18px; font-weight: 500; letter-spacing: -.5px;}
    .preco-dec { font-size: 15px; vertical-align: top; position: relative; top: 4px; padding-left:5px; }
    .preco-dec-antigo { font-size: 13px; vertical-align: top; position: relative; top: 4px; padding-left:5px; }
    .preco-de { font-size: 14px; color: #6b7280; margin-left: 6px; }
    .preco-de s { color: #6b7280; }

    .preco-antigo { color: #6b7280; margin-left: 6px; text-decoration: line-through; }

    .prod-preco-row {
      display: flex;
      align-items: center;
      gap: 4px;
    }
    .prod-desconto {
      display: inline-block;
      background: #38ad4c;
      color: #fff;
      font-size: 15px;
      font-weight: 700;
      padding: 3px 8px;
      border-radius: 4px;
      margin-left: 6px;
      line-height: 1.3;
      vertical-align: middle;
    }

    .prod-parcelas {
      display: block;
      font-size: 15px;
      color: #000000;
      font-weight: 500;
      margin-left: 6px;
      margin-bottom: 4px;
    }
    .prod-entrega{
      font-size:12px;
      color:var(--col-text);
      line-height:1.35;
      margin-top:4px;
      padding-left:6px;
    }
    .prod-entrega strong{font-weight:700;}
    .entrega-primeiro{color:var(--col-muted);font-size:11px;}
    /* Setas estilo Amazon */
    .scroll-arrow{
      position:absolute;
      top:0;
      bottom:30px;
      width:42px;
      background:rgba(255,255,255,.95);
      border:1px solid var(--col-border);
      border-radius:6px;
      box-shadow:-2px 0 8px rgba(0,0,0,.08);
      display:flex;
      align-items:center;
      justify-content:center;
      cursor:pointer;
      z-index:5;
      color:var(--col-text);
      font-size:22px;
      transition:background .15s;
    }
    .scroll-arrow:hover{background:#f7f7f7;}
    .scroll-arrow.left{left:-6px;box-shadow:2px 0 8px rgba(0,0,0,.08);}
    .scroll-arrow.right{right:-6px;}
    .scroll-arrow:disabled{opacity:.35;cursor:default;}
    @media (max-width:560px){
      .scroll-arrow{display:none;}
      .cat-row{padding:14px 12px 18px;}
      .cat-row-header h2{font-size:18px;}
    }
    /* Loading */
    .track-loading{
      display:flex;align-items:center;justify-content:center;
      gap:10px;padding:60px 20px;color:var(--col-muted);font-size:14px;
    }
    .spinner{
      width:22px;height:22px;border:3px solid #e0e0e0;
      border-top-color:var(--col-blue);border-radius:50%;
      animation:spin .8s linear infinite;
    }
    @keyframes spin{to{transform:rotate(360deg);}}
    .track-error{
      text-align:center;padding:40px;color:var(--col-muted);font-size:25px;font-weight: bold;
    }

    /* Grade de produtos */
.prod-grid{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:20px;
  margin-top:10px;
}
@media (max-width:1200px){.prod-grid{grid-template-columns:repeat(4,1fr)}}
@media (max-width:900px){.prod-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:600px){.prod-grid{grid-template-columns:repeat(2,1fr)}}

/* Ajuste no botão para o estilo escuro com ícone */
.btn-checkout {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  margin: 12px 0 0;
  background: #202e4d;
  color: #fff;
  border: none;
  border-radius: 6px;
  padding: 10px 0;
  font-weight: 700;
  font-size: .85rem;
  cursor: pointer;
  transition: background .2s;
}
.btn-checkout:hover { background: #ff0202; }
.btn-checkout i { font-size: 14px; }

/* Paginação */
.paginacao{
  display:flex;
  justify-content:center;
  align-items:center;
  gap:6px;
  margin:30px 0;
  font-size:14px;
  flex-wrap:wrap;
}
.pag-btn{
  min-width:34px;height:34px;
  display:flex;align-items:center;justify-content:center;
  border:1px solid var(--cinza-borda);
  border-radius:4px;
  background:#fff;
  color:var(--azul);
  cursor:pointer;
  text-decoration:none;
  padding:0 10px;
  user-select:none;
}
.pag-btn:hover{background:var(--cinza-bg)}
.pag-btn.ativo{
  border-color:#000;
  font-weight:700;
  color:#0f1111;
  cursor:default;
  pointer-events:none;
}
.pag-btn.desabilitado{
  color:#ccc;
  border-color:var(--cinza-borda);
  cursor:not-allowed;
  pointer-events:none;
}
.pag-reticencias{
  padding:0 6px;
  color:var(--cinza);
}

/* Layout com sidebar de filtros */
.produtos-layout{
  display:flex;
  align-items:flex-start;
  gap:24px;
  margin-top:10px;
}

.filtros-sidebar{
  width:220px;
  flex-shrink:0;
  background:var(--col-card);
  border:1px solid var(--col-border);
  border-radius:8px;
  padding:16px;
  position:sticky;
  top:16px;
}

.filtro-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:12px;
  padding-bottom:10px;
  border-bottom:1px solid var(--col-border);
}
.filtro-header h3{
  font-size:16px;
  margin:0;
  color:var(--col-text);
}
.filtro-limpar{
  background:none;
  border:none;
  color:var(--col-link);
  font-size:12px;
  cursor:pointer;
  padding:0;
}
.filtro-limpar:hover{color:var(--col-link-hover);text-decoration:underline;}

.filtro-grupo{margin-bottom:18px;}
.filtro-grupo h4{
  font-size:13px;
  font-weight:500;
  margin:0 0 8px;
  color:var(--col-text);
}

.filtro-select{
  width:100%;
  padding:7px 8px;
  border:1px solid var(--col-border);
  border-radius:4px;
  font-size:13px;
  margin-bottom:6px;
  background:#fff;
  color:var(--col-text);
}
.filtro-select:disabled{background:#f3f3f3;color:#999;cursor:not-allowed;}

/* Seletor pesquisável de modelos */
.modelo-combobox{position:relative;margin-bottom:6px;}
.modelo-combobox .modelo-combobox__input{
  height:36px;
  margin-bottom:0;
  padding-right:36px;
  background:#fff;
}
.modelo-combobox__input::-webkit-search-cancel-button{margin-right:2px;}
.modelo-combobox__toggle{
  position:absolute;
  top:1px;
  right:1px;
  width:34px;
  height:34px;
  display:grid;
  place-items:center;
  border:0;
  border-left:1px solid var(--col-border);
  border-radius:0 4px 4px 0;
  background:#f8fafc;
  color:var(--col-muted);
  cursor:pointer;
}
.modelo-combobox__toggle:hover{background:#eef3f9;color:var(--col-blue);}
.modelo-combobox.aberto .modelo-combobox__toggle i{transform:rotate(180deg);}
.modelo-combobox__toggle i{font-size:11px;transition:transform .18s ease;}
.modelo-combobox__lista{
  position:absolute;
  top:calc(100% + 5px);
  left:0;
  z-index:40;
  width:max(100%, 250px);
  max-height:250px;
  padding:6px;
  overflow-y:auto;
  overscroll-behavior:contain;
  border:1px solid #d8dee8;
  border-radius:7px;
  background:#fff;
  box-shadow:0 12px 28px rgba(15,23,42,.18);
}
.modelo-combobox__opcao{
  width:100%;
  padding:9px 10px;
  border:0;
  border-radius:5px;
  background:transparent;
  color:var(--col-text);
  font-size:13px;
  text-align:left;
  cursor:pointer;
}
.modelo-combobox__opcao:hover,
.modelo-combobox__opcao.ativo{background:#eaf2ff;color:var(--col-blue-dark);}
.modelo-combobox__vazio{margin:0;padding:12px 10px;color:var(--col-muted);font-size:12px;}
@media(max-width:600px){
  .modelo-combobox__lista{width:100%;max-height:220px;}
}

.filtro-toggle-group{display:flex;gap:6px;flex-wrap:wrap;}
.filtro-toggle{
  flex:1;
  min-width:80px;
  padding:6px 8px;
  border:1px solid var(--col-border);
  border-radius:4px;
  background:#fff;
  color:var(--col-text);
  font-size:12px;
  cursor:pointer;
  transition:all .15s;
}
.filtro-toggle:hover{border-color:var(--col-blue);}
.filtro-toggle.ativo{
  background:var(--col-blue);
  border-color:var(--col-blue);
  color:#fff;
  font-weight:600;
}

.filtro-preco{display:flex;align-items:center;gap:6px;}
.filtro-preco input{
  width:100%;
  padding:6px 8px;
  border:1px solid var(--col-border);
  border-radius:4px;
  font-size:13px;
}
.filtro-preco span{color:var(--col-muted);font-size:13px;}

.filtro-aplicar-btn{
  width:100%;
  background:var(--col-blue);
  color:#fff;
  border:none;
  border-radius:6px;
  padding:10px 0;
  font-weight:700;
  font-size:13px;
  cursor:pointer;
  margin-top:4px;
}
.filtro-aplicar-btn:hover{background:var(--col-blue-dark);}

.produtos-content{flex:1;min-width:0;}

/* Sidebar vira bloco acima do grid em telas menores */
@media (max-width:900px){
  .produtos-layout{flex-direction:column;}
  .filtros-sidebar{width:100%;position:static;}
}

/* Grade de produtos — 4 colunas em vez de 5 pra sobrar espaço pro filtro */
.prod-grid{
  grid-template-columns:repeat(4,minmax(0,1fr));
}
@media (max-width:1200px){.prod-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:900px){.prod-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:600px){
  .produtos-container{padding:0 12px;}
  .produtos-layout{width:100%;gap:16px;}
  .filtro-preco input{min-width:0;}
  .filtro-toggle{min-width:0;}
  .produtos-content{width:100%;max-width:100%;}
  .prod-grid{
    width:100%;
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
  }
  .prod-card{min-width:0;padding:10px;overflow:hidden;}
  .prod-card .img-box{width:100%;}
  .prod-title{font-size:14px;min-height:38px;padding-left:0;}
  .badge-oferta{
    width:100%;
    max-width:100%;
    margin-left:0;
    padding:5px 4px;
    overflow:hidden;
    font-size:9px;
    text-align:center;
    white-space:nowrap;
    text-overflow:ellipsis;
  }
  .prod-preco-row{min-width:0;flex-wrap:wrap;gap:2px;}
  .prod-preco{margin:10px 0 6px;padding-left:0;font-size:21px;}
  .preco-int{font-size:25px;}
  .prod-desconto{margin-left:3px;font-size:12px;padding:3px 5px;}
  .preco-antigo-inline{margin-left:0;font-size:12px;}
  .prod-parcelas{margin-left:0;font-size:12px;}
  .btn-checkout{padding:9px 4px;font-size:12px;}
  .sem-foto-tintim{min-height:0;padding:10px 6px;font-size:12px;}
  .sem-foto-tintim i{font-size:24px;}
  .sem-foto-tintim small{font-size:10px;}
}
