*{box-sizing:border-box}html,body{margin:0;padding:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,'Helvetica Neue',Arial,'Noto Sans',sans-serif;background:#f7fff9;color:#12221a}
:root{
  --bg:#f0fff4;
  --card:#ffffff;
  --accent:#0ea765;         /* verde clarinho */
  --accent-2:#0b7a44;       /* verde escuro */
  --ink:#0f172a;
  --muted:#5f6b62;
  --ring:rgba(14,167,101,.28);
  --shadow:0 8px 20px rgba(17,24,39,.08);
  --radius:16px;
}
.topbar{position:sticky;top:0;z-index:5;display:flex;align-items:center;gap:16px;padding:14px 18px;background:#0b7a44;color:#fff}
.brand{display:flex;align-items:center;gap:12px}
.brand .logo img{width:34px;height:34px;border-radius:50%;display:block}
.brand h1{margin:0;font-size:20px;letter-spacing:.3px}
.brand small{opacity:.9}
.anchors{display:flex;gap:14px;margin-left:auto;margin-right:12px;flex-wrap:wrap}
.anchors a{color:#fff;text-decoration:none;background:rgba(255,255,255,.15);padding:8px 12px;border-radius:999px;font-weight:600;backdrop-filter:blur(4px)}
.anchors a:hover{background:rgba(255,255,255,.28)}
.cart-area .cart-btn{background:#fff;color:#0b7a44}
main{max-width:1120px;margin:24px auto;padding:0 16px}
.card{background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow);padding:16px}
.cep-card .row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.grow{flex:1}
input{width:100%;padding:12px 14px;border:1px solid #C1BFBF;border-radius:12px;outline:none}
input:focus{border-color:var(--accent);box-shadow:0 0 0 4px var(--ring)}
.btn{border:none;border-radius:999px;padding:10px 16px;font-weight:700;cursor:pointer;background:#A0E0B5;color:#211F1F;}
.btn:hover{filter:brightness(.97)}
.btn.primary{background:var(--accent);color:#fff}
.icon-btn{border:none;background:transparent;font-size:18px;cursor:pointer}
.muted{color:var(--muted)}
.menu-section{margin:28px 0}
.menu-section h2{margin:8px 0 14px;font-size:22px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
@media (max-width: 980px){.grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width: 640px){.grid{grid-template-columns:1fr} .anchors{display:none}}
.card.item{display:flex;flex-direction:column;gap:12px;overflow:hidden}
.item .image{aspect-ratio:16/10;background:#f3f4f6;border-radius:12px;overflow:hidden}
.item .image img{width:100%;height:100%;object-fit:cover;display:block}
.item .title{font-weight:800}
.item .desc{font-size:.95rem;color:#4b5563;line-height:1.35}
.item .meta{display:flex;align-items:center;justify-content:space-between}
.price{font-weight:900;color:#0b7a44}
.footer{background:#0b1f16;color:#e5e7eb;margin-top:32px}
.footer .container{max-width:1120px;margin:0 auto;padding:22px 16px;display:flex;justify-content:space-between;align-items:center;gap:8px;flex-wrap:wrap}
/* Drawer */
.drawer{position:fixed;inset:0;background:rgba(15,23,42,.5);display:flex;justify-content:flex-end;padding:12px}
.drawer.hidden{display:none}
.drawer-content{width:min(520px,100%);background:#fff;border-radius:16px;box-shadow:var(--shadow);display:flex;flex-direction:column;overflow:hidden}
.drawer-header{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;border-bottom:1px solid #f1f5f9}
.cart-items{padding:12px 14px;display:flex;flex-direction:column;gap:10px;max-height:45vh;overflow:auto}
.cart-line{display:grid;grid-template-columns:1fr auto auto auto;gap:10px;align-items:center;padding:10px;border:1px solid #f1f5f9;border-radius:12px}
.qty{display:flex;border-radius:10px;border:1px solid #e5e7eb;overflow:hidden}
.qty button{border:none;background:#eef6f0;width:34px;height:34px;font-size:18px;cursor:pointer}
.qty span{min-width:36px;display:grid;place-items:center}
.totals{display:grid;gap:4px;margin:8px 0 12px}
.drawer-footer{padding:12px 16px;border-top:1px solid #f1f5f9}
.pix-config{margin:10px 0}
.pix-config label{display:block;margin:8px 0}
.pix-area{display:grid;place-items:center;gap:8px;margin-top:12px}
.copyline{display:flex;gap:8px;width:100%}
.copyline input{flex:1}

.qr-output{display:grid;place-items:center;gap:10px;margin-top:10px}
.qr-output img{width:256px;height:256px;background:#fff;border:1px solid #e5e7eb;border-radius:12px;image-rendering:pixelated}
.qr-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.required-note{font-size:.85rem;color:#b45309}


/* === Scrollbar for checkout drawer === */
.drawer{overflow:auto; align-items:stretch;}
.drawer-content{max-height:calc(100vh - 24px); overflow:auto;}
/* ensure inner grids don't break layout on small heights */
.pix-area{padding-bottom:12px}

/* === Botão Adicionado === */
.botao-verde {
    background-color: #2e7d32; /* Verde escuro */
    color: white;
    padding: 14px 28px;
    border: none;
    border-radius: 8px;
    font-size: 18px;
    font-weight: bold;
    text-decoration: none;
    display: inline-block;
    transition: background 0.3s ease, transform 0.2s ease;
    box-shadow: 0 4px 8px rgba(0,0,0,0.2);
  }

  .botao-verde:hover {
    background-color: #43a047; /* Verde mais claro no hover */
    transform: scale(1.05);
  }