/* Cuida de Pet — temas de cor por tipo de loja. <html data-tema="petshop|banho|vet|hotel"> (todos claros e alegres) */
:root,html[data-tema]{
  --f:"Nunito",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; --fd:"Baloo 2","Nunito",system-ui,sans-serif;
  --bg:#fff8ef; --bg2:#fdeedd; --card:#ffffff; --card2:#fff4e8; --line:#f1dcc4;
  --tx:#3a2a1e; --tx2:#8a6f5a; --gold:#ef7d32; --gold2:#c95a14; --on-gold:#ffffff;
  --red:#d2453b; --green:#2e8b57; --blue:#3d6fc4; --ac2:#1fa39a;
  --warn-bg:#fff0dc; --warn-line:#f5cfa0; --bad-bg:#fdecea; --bad-line:#f0b7b0; --bad-tx:#a8302a;
  --nav-bg:#ffffff; --top-bg:rgba(255,248,239,.95); --gold-soft:rgba(239,125,50,.11); --gold-soft2:#ffe3cc; --hero-fade:rgba(58,30,10,.82);
  --pole:linear-gradient(90deg,#ffb27a,#ef7d32 30%,#1fa39a 50%,#ef7d32 70%,#ffb27a);
  color-scheme:light;
}
html[data-tema="banho"]{
  --bg:#f1f8fe; --bg2:#e2f0fb; --card2:#eef7fe; --line:#cfe3f3; --tx:#1d3346; --tx2:#5f7b92;
  --gold:#2b8fd6; --gold2:#1767a8; --ac2:#f0a03c; --warn-bg:#e3f1fc; --warn-line:#b9daf3;
  --top-bg:rgba(241,248,254,.95); --gold-soft:rgba(43,143,214,.1); --gold-soft2:#d4eafa; --hero-fade:rgba(10,35,60,.82);
  --pole:linear-gradient(90deg,#9fd3fa,#2b8fd6 30%,#ffd08a 50%,#2b8fd6 70%,#9fd3fa);
}
html[data-tema="vet"]{
  --bg:#f2faf5; --bg2:#e1f3e8; --card2:#eef8f2; --line:#cde7d7; --tx:#1d3326; --tx2:#5f7d6a;
  --gold:#2f9d62; --gold2:#1f7448; --ac2:#2b8fd6; --warn-bg:#e4f5ea; --warn-line:#b7e0c6;
  --top-bg:rgba(242,250,245,.95); --gold-soft:rgba(47,157,98,.1); --gold-soft2:#d3efdd; --hero-fade:rgba(10,45,25,.82);
  --pole:linear-gradient(90deg,#a6e3bf,#2f9d62 30%,#bfe3fa 50%,#2f9d62 70%,#a6e3bf);
}
html[data-tema="hotel"]{
  --bg:#f7f4fd; --bg2:#ece5fb; --card2:#f4f0fd; --line:#ded3f5; --tx:#2b2142; --tx2:#74679a;
  --gold:#7b5cc9; --gold2:#5a3ea6; --ac2:#ef7d32; --warn-bg:#efe9fc; --warn-line:#d3c4f3;
  --top-bg:rgba(247,244,253,.95); --gold-soft:rgba(123,92,201,.1); --gold-soft2:#e4dafa; --hero-fade:rgba(35,20,70,.82);
  --pole:linear-gradient(90deg,#cdbdf5,#7b5cc9 30%,#ffd08a 50%,#7b5cc9 70%,#cdbdf5);
}
body{color-scheme:light;font-family:var(--f)}
.pole{background:var(--pole)!important;height:4px}
h1{font-family:var(--fd);font-weight:700;text-transform:none;letter-spacing:0;line-height:1.1}
h2{font-family:var(--fd);font-weight:700;letter-spacing:.06em}
.brand b{font-family:var(--fd);font-weight:700;text-transform:none;letter-spacing:0}
.kpi b{font-family:var(--fd);font-weight:700}
.hero .cap,.hero .cap h1{color:#fff} .hero .frase{color:#fbeee2}
.badge{background:#f4ebe1;color:#7a604b}
.b-green{background:#e3f4ea;color:#1f6b43} .b-red{background:#fbe3e0;color:#a8302a}
.b-gold{background:var(--gold-soft2);color:var(--gold2)} .b-blue{background:#e4ecfa;color:#2c4f93}
.item.feito{border-color:#bfe3cc}
.pix-card{background:linear-gradient(135deg,#e9f7f0,#ffffff);border-color:#bfe3cc}
.modal{background:rgba(50,30,15,.45)}
.mock{background:#fff;border:1px solid var(--line)}
.tabela td,.tabela th{border-color:var(--line)}
.item,.card,.kpi{box-shadow:0 1px 3px rgba(120,80,40,.06)}
.app-banner{background:linear-gradient(135deg,var(--gold-soft2),#fff)}
.btn{border-radius:14px}
.faixa-demo{background:var(--gold);color:var(--on-gold);font-size:13px;text-align:center;padding:6px 12px;font-weight:700}

/* ---------- pets ---------- */
.pet-av{width:52px;height:52px;border-radius:50%;object-fit:cover;flex:0 0 52px;background:var(--gold-soft2);display:grid;place-items:center;font-size:26px;border:2px solid #fff;box-shadow:0 1px 4px rgba(0,0,0,.12)}
.pet-av.g{width:96px;height:96px;flex-basis:96px;font-size:46px}
.pet-av.p{width:30px;height:30px;flex-basis:30px;font-size:16px;border-width:1px}
.pets-grade{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin:12px 0}
.pet-card{background:var(--card);border:1px solid var(--line);border-radius:18px;overflow:hidden;text-align:left;padding:0;cursor:pointer;color:inherit;font:inherit;display:flex;flex-direction:column;box-shadow:0 2px 8px rgba(120,80,40,.07)}
.pet-card .ft{aspect-ratio:1/1;width:100%;object-fit:cover;background:linear-gradient(135deg,var(--gold-soft2),var(--card2));display:grid;place-items:center;font-size:56px}
.pet-card .tx{padding:10px 12px 12px}.pet-card b{display:block;font:700 18px/1.1 var(--fd)}.pet-card small{color:var(--tx2);font-size:13px;display:block}
.pet-linha{display:flex;gap:12px;align-items:center}
.pet-linha .meio{flex:1;min-width:0}.pet-linha .meio b{display:block;font-size:16px}.pet-linha .meio small{display:block;color:var(--tx2);font-size:13px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.alerta-pet{background:#fff1ee;border:1px solid #f3c2b8;color:#9b3020;border-radius:10px;padding:6px 10px;font-size:13px;margin-top:6px}
.escolha-pets{display:grid;gap:10px;margin:12px 0}
.escolha-pet{display:flex;align-items:center;gap:12px;background:var(--card);border:2px solid var(--line);border-radius:16px;padding:10px 14px;cursor:pointer}
.escolha-pet input{width:24px;height:24px;accent-color:var(--gold);flex:0 0 24px}
.escolha-pet:has(input:checked){border-color:var(--gold);background:var(--gold-soft)}
.escolha-pet b{display:block;font-size:17px}.escolha-pet small{color:var(--tx2)}
.ficha{display:grid;grid-template-columns:1fr 1fr;gap:8px 14px;margin:10px 0}
.ficha div small{display:block;color:var(--tx2);font-size:12px}.ficha div b{font-weight:700}
.ficha .w2{grid-column:1/-1}
.tag-porte{display:inline-block;background:var(--gold-soft2);color:var(--gold2);font-weight:800;border-radius:8px;padding:0 7px;font-size:12px;margin-left:4px}
.precos-porte{display:flex;gap:6px;flex-wrap:wrap;margin-top:4px}.precos-porte span{background:var(--card2);border:1px solid var(--line);border-radius:8px;padding:1px 7px;font-size:12px}
/* ---------- lojinha ---------- */
.vitrine{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin:12px 0}
.prod{background:var(--card);border:1px solid var(--line);border-radius:18px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 2px 8px rgba(120,80,40,.07)}
.prod .ft{aspect-ratio:1/1;width:100%;object-fit:cover;background:linear-gradient(135deg,var(--gold-soft2),var(--card2));display:grid;place-items:center;font-size:52px}
.prod .tx{padding:10px 12px;flex:1;display:flex;flex-direction:column;gap:4px}.prod b{font-size:15px;line-height:1.25}.prod .pr{font:700 19px var(--fd);color:var(--gold2)}
.prod small{color:var(--tx2);font-size:12px}
.prod .qtd{display:flex;align-items:center;gap:6px;margin-top:auto}.prod .qtd button{width:36px;height:36px;border-radius:50%;border:1px solid var(--line);background:var(--card2);font-size:20px;cursor:pointer}
.prod .qtd span{min-width:22px;text-align:center;font-weight:800}
.carrinho{position:fixed;left:12px;right:12px;bottom:calc(72px + env(safe-area-inset-bottom));z-index:7;max-width:736px;margin:0 auto;background:var(--gold);color:var(--on-gold);border-radius:16px;padding:12px 16px;display:flex;align-items:center;gap:10px;box-shadow:0 10px 24px -10px rgba(0,0,0,.5);font-weight:800;border:0;width:calc(100% - 24px);cursor:pointer;font-size:16px}
.carrinho span{flex:1;text-align:left}
.cats{display:flex;gap:8px;overflow-x:auto;padding:4px 0 8px;scrollbar-width:none}.cats button{flex:0 0 auto}
/* suporte do dono */
.suporte-cta{display:flex;gap:12px;align-items:center;text-decoration:none;color:inherit;border:2px solid var(--gold);background:linear-gradient(135deg,var(--gold-soft2),#fff)}
.suporte-cta span{font-size:30px}.suporte-cta b{display:block;font-size:16px}.suporte-cta small{color:var(--tx2)}
.suporte-box{border-style:dashed}