/* Tema Rabisco (premium): papelaria criativa - coral, azul-marinho e pasteis, Fredoka nos titulos,
   folha pautada, rabiscos, post-it e lapis. Carregado depois do CSS do Vitrine e do premium.css (pagina do produto premium). */

.tema-rabisco { --rb-tinta: var(--titulos, #2b2d42); --rb-coral: #ff5a5f; --rb-lilas: #d9d2f5; --rb-menta: #c9ecdf; --rb-amarelo: #ffe08a; --rb-linha: #ebe5d8; }
.tema-rabisco, .rb-topo, .rb-rodape, .rb-folha, .rb-frete { --rb-risco: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 120 12' preserveAspectRatio='none'%3E%3Cpath d='M2 8C20 3 34 10 52 6s34-4 50 1 14-2 16-3' fill='none' stroke='%23ff5a5f' stroke-width='3.2' stroke-linecap='round'/%3E%3C/svg%3E"); }

/* titulos das secoes: rabisco coral embaixo */
.tema-rabisco .vt-secao-cab { align-items: flex-end; margin-bottom: 24px; }
.tema-rabisco .vt-secao-cab h2 { position: relative; padding-bottom: 10px; font-size: 34px; font-weight: 600 !important; letter-spacing: -.01em; color: var(--rb-tinta); }
.tema-rabisco .vt-secao-cab h2::after { content: ""; position: absolute; left: 0; bottom: 0; width: min(100%, 180px); height: 12px; background: var(--rb-risco) left / 100% 100% no-repeat; }
.tema-rabisco .vt-secao-cab a { display: inline-flex; align-items: center; height: 34px; padding: 0 16px; border: 2px solid var(--rb-tinta); border-radius: 999px; color: var(--rb-tinta) !important; font-weight: 800; font-size: 13px; }
.tema-rabisco .vt-secao-cab a:hover { background: var(--rb-tinta); color: #fff !important; }

/* cartao: borda marinho e sombra deslocada, como recorte de papel */
.tema-rabisco .vt-card { border: 2px solid var(--rb-tinta); border-radius: 16px; background: #fff; box-shadow: 5px 5px 0 var(--rb-tinta) !important; overflow: hidden; transition: transform .2s, box-shadow .2s; }
.tema-rabisco .vt-card:hover { box-shadow: 8px 8px 0 var(--rb-coral) !important; }
.tema-rabisco .vt-card-img { border-radius: 0; background: #fff; border-bottom: 2px solid var(--rb-tinta); }
.tema-rabisco .vt-card-info { padding: 14px 16px 16px; }
.tema-rabisco .vt-card-nome { font-size: 15px; font-weight: 700; color: #2b2d42; }
.tema-rabisco .vt-card-preco strong { font-family: var(--fonte-titulos), sans-serif; font-size: 24px; font-weight: 600; color: var(--rb-coral); }
.tema-rabisco .ppc-marca { color: #8d8fa6; font-weight: 700; }
.tema-rabisco .vt-card-botao { border-radius: 999px; background: var(--rb-coral); color: #fff; font-weight: 800; }
.tema-rabisco .vt-card:hover .vt-card-botao { background: var(--rb-tinta); }
.tema-rabisco .ppc .ppc-ver { border-radius: 999px; background: rgba(255, 255, 255, .95); color: var(--rb-tinta); }
.tema-rabisco .vt-selo { border-radius: 6px; background: var(--rb-amarelo); color: var(--rb-tinta); font-weight: 900; transform: rotate(-4deg); }

/* folha de caderno com lista de material (bloco Destaques) */
.rb-folha { position: relative; display: grid; grid-template-columns: minmax(240px, .8fr) 1.4fr; align-items: start; gap: 18px 50px; padding: 46px 48px 46px 92px; border-radius: 6px; background: #fff repeating-linear-gradient(transparent 0 37px, #cfe0f5 37px 38px); box-shadow: 0 2px 0 #ebe5d8, 0 18px 40px rgba(43, 45, 66, .08); }
.rb-folha::before { content: ""; position: absolute; left: 64px; top: 0; bottom: 0; width: 2px; background: #ff9a9d; }
.rb-folha::after { content: ""; position: absolute; left: 22px; top: 40px; bottom: 40px; width: 18px; background: radial-gradient(circle, #fbf8f2 6px, transparent 7px) 0 0 / 18px 76px repeat-y; }
.rb-folha-cab { display: grid; justify-items: start; gap: 10px; }
.rb-folha-cab small { display: inline-flex; padding: 4px 12px; border-radius: 4px; background: #ffe08a; color: #2b2d42; font-size: 13px; font-weight: 800; transform: rotate(-3deg); }
body.vitrine .rb-folha-cab h2 { margin: 0; font-family: var(--fonte-titulos), sans-serif; font-size: 42px; font-weight: 600; line-height: 1.05; color: #2b2d42; }
.rb-folha-cab p { margin: 0; color: #4b4e68; font-size: 16px; line-height: 1.6; }
.rb-lista { display: grid; margin: 0; padding: 0; list-style: none; }
.rb-item { display: grid; grid-template-columns: 30px auto 1fr auto; align-items: center; column-gap: 12px; min-height: 38px; color: #2b2d42; text-decoration: none; }
.rb-caixa { position: relative; width: 22px; height: 22px; border: 2px solid #2b2d42; border-radius: 5px; background: #fff; }
.rb-caixa::after { content: ""; position: absolute; left: 5px; top: -2px; width: 8px; height: 15px; border: solid #ff5a5f; border-width: 0 4px 4px 0; transform: rotate(40deg) scale(0); transform-origin: 50% 70%; transition: transform .2s; }
.rb-item strong { font-family: var(--fonte-titulos), sans-serif; font-size: 21px; font-weight: 500; white-space: nowrap; }
.rb-item span { color: #6b6e88; font-size: 14px; }
.rb-item b { padding: 2px 10px; border-radius: 999px; background: #c9ecdf; font-size: 12.5px; }
a.rb-item:hover .rb-caixa::after { transform: rotate(40deg) scale(1); }
a.rb-item:hover strong { text-decoration: line-through; text-decoration-color: #ff5a5f; text-decoration-thickness: 3px; }
a.rb-item:hover { color: #2b2d42 !important; }
.rb-folha-botao { grid-column: 2; justify-self: start; display: inline-flex; align-items: center; height: 48px; margin-top: 8px; padding: 0 28px; border-radius: 999px; background: #ff5a5f; color: #fff !important; font-weight: 800; text-decoration: none; box-shadow: 4px 4px 0 #2b2d42; }
.rb-folha-botao:hover { background: #2b2d42; box-shadow: 4px 4px 0 #ff5a5f; }

/* mosaico em quadradinhos coloridos, banners, depoimentos, blog, newsletter */
.tema-rabisco .hdl-mos > * { text-align: center; }
.tema-rabisco .hdl-mos-img { border-radius: 18px !important; border: 2px solid var(--rb-tinta); box-shadow: 4px 4px 0 var(--rb-tinta); transition: transform .2s, box-shadow .2s; }
.tema-rabisco .hdl-mos a:hover .hdl-mos-img { transform: translate(-2px, -2px) rotate(-2deg); box-shadow: 6px 6px 0 var(--rb-coral); }
.tema-rabisco .hdl-mos a { color: var(--rb-tinta); font-family: var(--fonte-titulos), sans-serif; font-weight: 600; }
.tema-rabisco .hdl-hero { border-radius: 20px; overflow: hidden; border: 2px solid var(--rb-tinta); }
.tema-rabisco .hdl-hero .vt-botao { border-radius: 999px; background: var(--rb-coral); color: #fff; }
.tema-rabisco .hdl-it-img img { border-radius: 20px; border: 2px solid var(--rb-tinta); box-shadow: 8px 8px 0 var(--rb-lilas); }
.tema-rabisco .hdl-it-txt h2 { font-size: 44px; font-weight: 600; color: var(--rb-tinta); }
.tema-rabisco .hdl-depo figure { border: 0; border-radius: 4px; background: var(--rb-amarelo); box-shadow: 0 10px 20px rgba(43, 45, 66, .08); transform: rotate(-1deg); }
.tema-rabisco .hdl-depo figure:nth-child(2n) { background: var(--rb-menta); transform: rotate(1.2deg); }
.tema-rabisco .hdl-depo figure:nth-child(3n) { background: var(--rb-lilas); }
.tema-rabisco .vt-blog a { border: 2px solid var(--rb-tinta); border-radius: 16px; background: #fff; overflow: hidden; }
.tema-rabisco .vt-blog strong { font-family: var(--fonte-titulos), sans-serif; font-size: 21px; font-weight: 600; color: var(--rb-tinta); }
body.vitrine.tema-rabisco .vt-news { border-radius: 22px; background: var(--rb-lilas); color: var(--rb-tinta); border: 2px solid var(--rb-tinta); }
body.vitrine.tema-rabisco .vt-news h3 { color: var(--rb-tinta) !important; font-family: var(--fonte-titulos), sans-serif; font-weight: 600; }
body.vitrine.tema-rabisco .vt-news p { color: #4b4e68; }
body.vitrine.tema-rabisco .vt-news-campo { border-radius: 999px; }
body.vitrine.tema-rabisco .vt-news-campo button { border-radius: 999px; background: var(--rb-coral); color: #fff; }
.tema-rabisco .vt-vantagens > * { border: 2px solid var(--rb-tinta); border-radius: 16px; background: #fff; }
.tema-rabisco .vt-vantagens i { border-radius: 10px; background: var(--rb-menta); color: var(--rb-tinta); }

/* ---------- topo proprio (topo.php): creme, busca em pilula e rabisco no menu ---------- */
.rb-topo .vt-aviso { font-weight: 700; }
.rb-topo .vt-marca img { width: auto; height: var(--logo-altura, 52px); max-width: 280px; border: 0; border-radius: 0; background: none; object-fit: contain; mix-blend-mode: multiply; }
body.vitrine .rb-topo .vt-busca input { height: 46px; border: 2px solid #2b2d42; border-radius: 999px; background: #fff; color: #2b2d42; }
body.vitrine .rb-topo .vt-busca input:focus { box-shadow: 3px 3px 0 #ff5a5f; }
body.vitrine .rb-topo .vt-busca button { border-radius: 999px !important; background: #ff5a5f !important; color: #fff !important; }
.rb-topo .vt-acao { color: #2b2d42 !important; }
.rb-topo .vt-acao:hover { background: #ffe08a; }
.rb-topo .vt-sacola .counter { background: #ff5a5f; color: #fff; }
@media (min-width: 992px) {
	.rb-topo .vt-barra .container { min-height: 86px; }
	body.vitrine .rb-topo .vt-busca { flex: 1 1 500px; max-width: 540px; margin: 0 auto; }
	body.vitrine .rb-topo .vt-menu { background: #fbf8f2; border-top: 2px solid #2b2d42; border-bottom: 2px solid #2b2d42; }
	.rb-topo .vt-menu .container { justify-content: center; gap: 4px; }
	body.vitrine .rb-topo .vt-menu > .container > a, body.vitrine .rb-topo .vt-menu-cat > a, body.vitrine .rb-topo .vt-menu-dep-link { position: relative; color: #2b2d42 !important; font-family: var(--fonte-titulos), sans-serif; font-size: 16.5px; font-weight: 500; background: transparent !important; white-space: nowrap; }
	body.vitrine .rb-topo .vt-menu > .container > a::after, body.vitrine .rb-topo .vt-menu-cat > a::after { content: ""; position: absolute; left: 12px; right: 12px; bottom: 6px; height: 8px; background: var(--rb-risco) left / 100% 100% no-repeat; clip-path: inset(0 100% 0 0); transition: clip-path .3s ease; }
	body.vitrine .rb-topo .vt-menu > .container > a:hover::after, body.vitrine .rb-topo .vt-menu-cat:hover > a::after { clip-path: inset(0 0 0 0); }
	body.vitrine .rb-topo .vt-menu a.vt-ofertas { color: #ff5a5f !important; }
	body.vitrine .rb-topo .vt-menu-cat > a > .lni-chevron-down { display: none; }
	body.vitrine .rb-topo .vt-mega-painel, body.vitrine .rb-topo .vt-menu-cat-lista, body.vitrine .rb-topo .vt-menu-dep-lista { border: 2px solid #2b2d42; border-radius: 18px; background: #fff; box-shadow: 8px 8px 0 #2b2d42; }
	body.vitrine .rb-topo .vt-mega-painel a, body.vitrine .rb-topo .vt-menu-cat-lista a, body.vitrine .rb-topo .vt-menu-dep-lista a { color: #2b2d42 !important; font-family: var(--fonte), sans-serif; font-size: 14.5px; }
	body.vitrine .rb-topo .vt-mega-painel a::after, body.vitrine .rb-topo .vt-menu-cat-lista a::after { display: none; }
	body.vitrine .rb-topo .vt-mega-prod img { border-radius: 12px; background: #fbf8f2; }
}

/* ---------- rodape proprio (rodape.php): post-it e lista de tarefas ---------- */
.rb-assinatura { display: grid; grid-template-columns: auto auto; justify-content: center; align-items: center; gap: 30px 60px; padding: 10px 0 46px; }
.rb-postit { position: relative; max-width: 380px; margin: 0; padding: 30px 28px 26px; background: #ffe08a; color: #2b2d42; font-family: var(--fonte-titulos), sans-serif; font-size: 26px; font-weight: 500; line-height: 1.15; transform: rotate(-3deg); box-shadow: 0 14px 26px rgba(0, 0, 0, .25); }
.rb-postit::before { content: ""; position: absolute; left: 50%; top: -12px; width: 90px; height: 24px; margin-left: -45px; background: rgba(255, 154, 157, .75); transform: rotate(2deg); }
.rb-checks { display: grid; gap: 12px; margin: 0; padding: 0; list-style: none; }
.rb-checks li { display: flex; align-items: center; gap: 12px; color: #e6e7f1; font-size: 15px; font-weight: 700; }
.rb-checks li::before { content: "\2713"; flex: none; display: grid; place-items: center; width: 22px; height: 22px; border: 2px solid #c4c6d8; border-radius: 5px; color: #ff5a5f; font-size: 16px; font-weight: 900; line-height: 1; }
.rb-rodape h3 { font-family: var(--fonte-titulos), sans-serif !important; font-size: 19px !important; font-weight: 600 !important; color: #fff !important; }
.rb-rodape .vt-redes a { border-radius: 10px; }

/* ---------- pagina do produto premium ---------- */
.tema-rabisco .pp, .tema-rabisco .ppa { --pp-titulo-tam: 36px; --pp-preco-tam: 34px; --pp-raio: 16px; --pp-raio-botao: 999px; --pp-suave: #f4efe4; --pp-borda: var(--rb-linha); --pp-acento: var(--rb-coral); }
.tema-rabisco .pp-nome { font-weight: 600; }
.tema-rabisco .pp-marca { color: #8d8fa6; font-weight: 800; }
.tema-rabisco .pp-foto { background: #fff; border: 2px solid var(--rb-tinta); }
.tema-rabisco .pp-mini { background: #fff; }
.tema-rabisco .pp-preco { background: #fff; border: 2px dashed var(--rb-tinta); }
.tema-rabisco .pp-preco-valor { font-family: var(--fonte-titulos), sans-serif; font-weight: 600; color: var(--rb-coral); }
.tema-rabisco .pp-preco-off { border-radius: 6px; background: var(--rb-amarelo); color: var(--rb-tinta); }
.tema-rabisco .pp .opcao.pp-op.active { --pp-op-borda: var(--rb-tinta); --pp-op-fundo: var(--rb-tinta); --pp-op-cor: #fff; }
.tema-rabisco .pp .pp-var-cores .opcao.pp-op.active { --pp-op-fundo: #fff; --pp-op-cor: var(--rb-tinta); }
.tema-rabisco .pp .pp-botao { background: var(--rb-coral); color: #fff; --pp-b-sombra: 4px 4px 0 #2b2d42; --pp-b-peso: 800; }
.tema-rabisco .pp .pp-botao:hover { background: var(--rb-tinta); }
.tema-rabisco .pp .pp-agora { border: 2px solid var(--rb-tinta); color: var(--rb-tinta); }
.tema-rabisco .pp .pp-agora:hover { background: var(--rb-amarelo); }
.tema-rabisco .pp-selo { border-radius: 6px; background: var(--rb-amarelo); color: var(--rb-tinta); }
.tema-rabisco .pp-garantias svg { border-radius: 10px; background: var(--rb-menta); color: var(--rb-tinta); }
.tema-rabisco .ppa .ppa-titulo { font-family: var(--fonte-titulos), sans-serif; font-size: 26px; font-weight: 600; }
.tema-rabisco .ppa-destaques li { background: #fff; border: 2px solid var(--rb-tinta); border-radius: 14px; }
.tema-rabisco .ppa-destaques li::before { background-color: var(--rb-coral); }

/* ---------- carrinho (carrinho.php): lapis riscando ---------- */
body.vitrine.tema-rabisco .ck h1 { font-size: 42px; font-weight: 600; color: var(--rb-tinta); }
body.vitrine.tema-rabisco .co-passos .atual { color: var(--rb-coral); }
body.vitrine.tema-rabisco .ck-item, body.vitrine.tema-rabisco .co-bloco { border: 2px solid var(--rb-tinta); border-radius: 16px; background: #fff; }
body.vitrine.tema-rabisco .ck-foto img { background: #fbf8f2; border-radius: 10px; }
body.vitrine.tema-rabisco .ck-resumo { border: 2px solid var(--rb-tinta); border-radius: 16px; background: #fff; box-shadow: 6px 6px 0 var(--rb-lilas); }
body.vitrine.tema-rabisco .ck-finalizar { border-radius: 999px !important; background: #ff5a5f !important; color: #fff !important; font-weight: 800 !important; }
.rb-frete { display: grid; gap: 12px; padding: 18px 22px 14px; border: 2px solid #2b2d42; border-radius: 16px; background: #fff repeating-linear-gradient(transparent 0 25px, #e3edf9 25px 26px); }
.rb-frete p { margin: 0; font-size: 14.5px; font-weight: 700; color: #2b2d42; }
.rb-frete p b { color: #ff5a5f; }
.rb-lapis { position: relative; display: block; height: 14px; margin-right: 64px; }
.rb-lapis i { position: relative; display: block; height: 8px; margin-top: 3px; border-radius: 6px; background: linear-gradient(90deg, #ff5a5f, #ffb347, #ffe08a, #7fd6b5, #9a8cf0); transition: width .6s ease; }
.rb-lapis i::after { content: ""; position: absolute; left: 100%; top: -5px; width: 64px; height: 18px; background: linear-gradient(90deg, #2b2d42 0 7px, #f0c9a0 7px 20px, #ffe08a 20px 52px, #c4c6d8 52px 56px, #ff9a9d 56px 64px); clip-path: polygon(0 50%, 20px 0, 100% 0, 100% 100%, 20px 100%); border-radius: 0 4px 4px 0; }

@media (max-width: 991px) {
	.rb-folha { grid-template-columns: 1fr; padding: 34px 20px 34px 60px; }
	.rb-folha::before { left: 44px; }
	.rb-folha::after { left: 12px; }
	.rb-folha-botao { grid-column: 1; }
	.rb-assinatura { grid-template-columns: 1fr; justify-items: center; }
}
@media (max-width: 767px) {
	.tema-rabisco .vt-secao-cab h2 { font-size: 27px; }
	body.vitrine .rb-folha-cab h2 { font-size: 31px; }
	.rb-item { grid-template-columns: 26px 1fr auto; padding: 6px 0; }
	.rb-item span { grid-column: 2 / -1; }
	.rb-item strong { font-size: 18px; white-space: normal; }
	.rb-postit { font-size: 21px; }
	.rb-topo .vt-marca img { height: 40px; max-width: 180px; }
	.tema-rabisco .pp, .tema-rabisco .ppa { --pp-titulo-tam: 28px; --pp-preco-tam: 30px; }
}
