/* =========================================================
   Livraria Arnaldo Niskier - E-commerce CSS (Responsive)
   Escopo: somente dentro de .lvr-wrap (não afeta o site todo)
   ========================================================= */

:root{
  --lvr-bg:#ffffff;
  --lvr-text:#111827;
  --lvr-muted:#6b7280;
  --lvr-border:#e5e7eb;
  --lvr-card:#ffffff;
  --lvr-soft:#f9fafb;

  --lvr-primary:#111111;
  --lvr-primary-text:#ffffff;

  --lvr-radius:12px;
  --lvr-shadow:0 6px 18px rgba(0,0,0,.06);

  /* Alinha com o tema (geralmente ~1140px) */
  --lvr-container: 1170px;
}

/* =========================================================
   Correções de layout (sem afetar header)
   ========================================================= */

/* Bootstrap .row tem margens negativas; corrige APENAS dentro do e-commerce */
.lvr-wrap .row{ margin-left:0 !important; margin-right:0 !important; }
.lvr-wrap .row [class*="col-"]{ padding-left:0 !important; padding-right:0 !important; }

/* Wrapper do e-commerce (o seu TEMPLATE já usa: <div class="container-wrap lvr-wrap"> ) */
.container-wrap.lvr-wrap{
  max-width: var(--lvr-container);
  margin: 0 auto;
  padding: 18px 18px 28px;
  background: var(--lvr-bg);
  box-shadow: var(--lvr-shadow);

  /* Importante: não vazar largura */
  overflow: hidden;
}

/* =========================================================
   Reset leve (somente dentro do e-commerce)
   ========================================================= */
.lvr-wrap,
.lvr-wrap *{ box-sizing:border-box; }

.lvr-wrap img{ max-width:100%; height:auto; display:block; }
.lvr-wrap a{ color:inherit; text-decoration:none; }
.lvr-wrap a:hover{ text-decoration:none; }

.lvr-wrap input,
.lvr-wrap select,
.lvr-wrap button,
.lvr-wrap textarea{ font:inherit; }

/* =========================================================
   Topbar (título + carrinho)
   ========================================================= */
.lvr-topbar{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:12px;
  margin-bottom:14px;
}
.lvr-topbar-right{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}

.lvr-title{
  font-size:32px;
  line-height:1.05;
  color:var(--lvr-text);
  margin:0 0 6px;
  letter-spacing:-.02em;
}
.lvr-subtitle{
  font-size:14px;
  color:var(--lvr-muted);
  margin:0;
}

/* =========================================================
   Botões
   ========================================================= */
.lvr-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  padding:10px 14px;
  border-radius:10px;
  border:1px solid var(--lvr-border);
  background:#ffffff;
  color:#111111;
  font-weight:600;
  font-size:13px;
  line-height:1;
  cursor:pointer;
  white-space:nowrap;
}
.lvr-btn.primary{
  background:var(--lvr-primary);
  color:var(--lvr-primary-text);
  border-color:var(--lvr-primary);
}
.lvr-btn:hover{ filter:brightness(.98); }

/* =========================================================
   LISTAGEM (index) - grid de cards
   ========================================================= */
.lvr-grid{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:14px;
}

.lvr-card{
  background:var(--lvr-card);
  border:1px solid var(--lvr-border);
  border-radius:var(--lvr-radius);
  padding:12px;
  display:flex;
  flex-direction:column;
}

/* Palco da capa */
.lvr-thumb{
  width:100%;
  min-height:220px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:10px;
  border:1px solid var(--lvr-border);
  background:#f3f4f6;
  margin-bottom:10px;
  overflow:hidden;
}

/* Capa 135 x 200 centralizada */
.lvr-thumb img{
  width:135px;
  height:200px;
  object-fit:cover;
  object-position:center;
  border-radius:4px;
}

/* Texto */
.lvr-author{
  font-size:12px;
  color:var(--lvr-muted);
  margin:0 0 4px;
}
.lvr-booktitle{
  font-size:14px;
  font-weight:700;
  color:var(--lvr-text);
  margin:0 0 8px;
  line-height:1.25;
  min-height:36px;
}
.lvr-price{
  font-size:16px;
  font-weight:800;
  margin:0 0 10px;
  color:var(--lvr-text);
}

.lvr-card-actions{
  margin-top:auto;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

/* =========================================================
   PRODUTO (product.php)
   ========================================================= */
.lvr-product{
  display:grid;
  grid-template-columns:360px 1fr;
  gap:18px;
  align-items:start;
}
.lvr-product-media{
  border:1px solid var(--lvr-border);
  border-radius:var(--lvr-radius);
  background:#f3f4f6;
  overflow:hidden;
  min-height:360px;
  display:flex;
  align-items:center;
  justify-content:center;
}
.lvr-product-media img{
  width:100%;
  height:100%;
  object-fit:cover;
}

.lvr-sku{
  display:inline-flex;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid var(--lvr-border);
  color:var(--lvr-muted);
  background:var(--lvr-soft);
  font-size:12px;
  margin-bottom:10px;
}
.lvr-product-title{
  font-size:26px;
  margin:0 0 6px;
  line-height:1.15;
  letter-spacing:-.02em;
}
.lvr-product-author{
  font-size:13px;
  color:var(--lvr-muted);
  margin:0 0 10px;
}
.lvr-product-price{
  font-size:18px;
  font-weight:800;
  margin:0 0 14px;
}
.lvr-product-desc{
  font-size:14px;
  color:#374151;
  line-height:1.5;
  margin:0 0 14px;
}

.lvr-product-actions{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  margin-top:10px;
}
.lvr-field{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:13px;
  color:var(--lvr-muted);
}
.lvr-field select,
.lvr-field input{
  border:1px solid var(--lvr-border);
  border-radius:10px;
  padding:9px 10px;
  background:#fff;
  min-width:70px;
}

/* =========================================================
   CARRINHO (cart.php)
   ========================================================= */
.lvr-cart{
  border:1px solid var(--lvr-border);
  border-radius:var(--lvr-radius);
  overflow:hidden;
}
.lvr-cart table{
  width:100%;
  border-collapse:collapse;
  background:#fff;
}
.lvr-cart thead th{
  text-align:left;
  font-size:12px;
  color:var(--lvr-muted);
  padding:12px;
  background:var(--lvr-soft);
  border-bottom:1px solid var(--lvr-border);
}
.lvr-cart tbody td{
  padding:12px;
  border-bottom:1px solid var(--lvr-border);
  vertical-align:middle;
  font-size:13px;
}
.lvr-cart tbody tr:last-child td{ border-bottom:none; }

.lvr-cart-item{
  display:flex;
  gap:10px;
  align-items:flex-start;
}
.lvr-cart-thumb{
  width:46px;
  height:62px;
  border:1px solid var(--lvr-border);
  border-radius:8px;
  background:#f3f4f6;
  overflow:hidden;
  flex:0 0 auto;
}
.lvr-cart-thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.lvr-cart-name{ font-weight:700; margin:0 0 2px; }
.lvr-cart-meta{ font-size:12px; color:var(--lvr-muted); margin:0; }

.lvr-cart select{
  border:1px solid var(--lvr-border);
  border-radius:10px;
  padding:8px 10px;
  background:#fff;
}

.lvr-cart-actions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:wrap;
  margin-top:14px;
}
.lvr-total{ font-size:16px; font-weight:800; }

/* =========================================================
   Alerts / badges / forms
   ========================================================= */
.lvr-alert{
  background:#fff1f2;
  border:1px solid #fecdd3;
  color:#991b1b;
  padding:12px;
  border-radius:10px;
  font-size:13px;
  margin:12px 0 10px;
}
.lvr-badge{
  display:inline-flex;
  align-items:center;
  padding:6px 10px;
  border-radius:999px;
  background:var(--lvr-soft);
  border:1px solid var(--lvr-border);
  color:var(--lvr-muted);
  font-size:12px;
}

.lvr-form{ max-width:520px; }
.lvr-form label{
  font-size:13px;
  color:var(--lvr-muted);
  display:block;
  margin:12px 0 6px;
}
.lvr-form input,
.lvr-form textarea{
  width:100%;
  border:1px solid var(--lvr-border);
  border-radius:10px;
  padding:10px 12px;
  background:#fff;
}
.lvr-form textarea{ min-height:120px; resize:vertical; }
.lvr-form .lvr-form-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  margin-top:14px;
}

/* =========================================================
   Responsivo
   ========================================================= */
@media (max-width: 980px){
  .container-wrap.lvr-wrap{ padding:14px; }
  .lvr-grid{ grid-template-columns:repeat(2, minmax(0,1fr)); }
  .lvr-product{ grid-template-columns:320px 1fr; }
}

@media (max-width: 640px){
  .lvr-title{ font-size:24px; }
  .lvr-topbar{ flex-direction:column; align-items:flex-start; }
  .lvr-topbar-right{ width:100%; }
  .lvr-grid{ grid-template-columns:1fr; }
  .lvr-product{ grid-template-columns:1fr; }
  .lvr-product-media{ min-height:280px; }

  /* carrinho vira cards */
  .lvr-cart table,
  .lvr-cart thead,
  .lvr-cart tbody,
  .lvr-cart th,
  .lvr-cart td,
  .lvr-cart tr{ display:block; width:100%; }
  .lvr-cart thead{ display:none; }
  .lvr-cart tbody td{ border-bottom:none; padding:10px 12px; }
  .lvr-cart tbody tr{ border-bottom:1px solid var(--lvr-border); padding:6px 0; }
  .lvr-cart tbody tr:last-child{ border-bottom:none; }

  .lvr-cart-actions{ flex-direction:column; align-items:flex-start; }
  .lvr-btn{ width:100%; }
}

/* =========================================
   HEADER: fundo branco só na largura do corpo
   (agora o container do header é .bg-topo)
   ========================================= */

/* o nav não deve pintar 100% da tela */
#page .fh5co-nav{
  background: transparent !important;
}

/* a caixa branca do header = mesma lógica do corpo */
#page .fh5co-nav .bg-topo{
  width: min(100%, 1170px) !important;   /* ajuste se seu tema usar outro max */
  margin: 0 auto !important;
  background: #fff !important;
  box-sizing: border-box;
}

/* evita scroll lateral causado por .row do bootstrap (margem negativa) */
#page .fh5co-nav .bg-topo .row{
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* garante que o conteúdo não “vaze” e crie scroll */
#page .fh5co-nav .bg-topo{
  overflow: hidden; /* pode trocar por overflow-x:hidden se preferir */
}

/* opcional: linha inferior discreta só na largura do header */
#page .fh5co-nav .bg-topo{
  border-bottom: 1px solid rgba(0,0,0,.08);
}

#fh5co-footer .footer-content,
#fh5co-footer .fh5co-footer{
  box-sizing: border-box;
}

/* se o tema pinta o footer em 100% e você quer só na largura do corpo,
   centralize e limite o próprio footer */
#fh5co-footer{
  width: min(100%, 1170px) !important;
  margin: 0 auto !important;
  overflow: hidden;
}

/* alguns temas colocam o background no footer interno.
   se o seu fundo verde estiver em outro elemento, replique nele também */
#fh5co-footer .container,
#fh5co-footer .container-wrap{
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
}

/* força apenas o container-wrap que envolve o footer */
.container-wrap > #fh5co-footer{
  width: 100% !important;
}
.container-wrap:has(> #fh5co-footer){
  max-width: 1170px !important;
  width: 100% !important;
  margin: 0 auto !important;
}


.lvr-wrap .lvr-product-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.lvr-wrap .lvr-back{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-weight:600;
  font-size:13px;
  color:inherit;
  text-decoration:none;
  padding:8px 10px;
  border-radius:10px;
  border:1px solid var(--lvr-border);
  background:#fff;
}

.lvr-wrap .lvr-back:hover{ filter:brightness(.98); }


/* ===== Carrinho: ajustes finos ===== */
.lvr-wrap .lvr-cart-qty{
  min-width: 86px;
  height: 38px;
  padding: 8px 10px;
  border-radius: 10px;
  border: 1px solid var(--lvr-border);
  background: #fff;
}

.lvr-wrap .lvr-cart-remove{
  font-weight: 700;
  color: #991b1b;
  text-decoration: none;
}

.lvr-wrap .lvr-cart-remove:hover{
  text-decoration: underline;
}

.lvr-cart-qty{
  min-width: 92px;
  appearance: none;
  border: 1px solid var(--lvr-border);
  border-radius: 10px;
  padding: 10px 34px 10px 12px;
  background-color: #fff;
  background-image:
    linear-gradient(45deg, transparent 50%, #6b7280 50%),
    linear-gradient(135deg, #6b7280 50%, transparent 50%);
  background-position:
    calc(100% - 18px) calc(50% - 3px),
    calc(100% - 12px) calc(50% - 3px);
  background-size: 6px 6px, 6px 6px;
  background-repeat: no-repeat;
  font-weight: 600;
}
.lvr-cart-qty:focus{
  outline: none;
  box-shadow: 0 0 0 3px rgba(17,17,17,.08);
}