/**
 * Blocos de oferta – CSS transportável
 * Use com Bootstrap 5 (grid: row, col-12, col-md-4, etc.).
 * Inclua após o Bootstrap: <link rel="stylesheet" href="offer-blocks.css">
 */

/* Variáveis usadas pelos blocos de oferta */
.offer-blocks {
	--ob-primary: #B3001B;
	--ob-primary-dark: #931F1D;
	--ob-border-gray: #dee2e6;
}

/* Container do card: fundo branco, cantos arredondados */
.offer-blocks .theme-border-radius,
.theme-border-radius {
	border-radius: 3.125rem;
	background: #fff;
	color: #000;
}

/* Borda destaque (ex.: Best Value) */
.offer-blocks .border-primary-new,
.border-primary-new {
	border: 2px solid var(--ob-primary, #B3001B);
}

/* Borda cinza para os outros cards */
.offer-blocks .border-gray,
.border-gray {
	border-color: var(--ob-border-gray, #dee2e6) !important;
}

/* Botão Add to cart – base */
.offer-blocks .btn-new,
.btn-new {
	font-size: 1rem;
	line-height: 1.5;
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, .15), 0 1px 1px rgba(0, 0, 0, .075);
	font-weight: 400;
	color: #fff;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	padding: 1rem 5rem;
	vertical-align: middle;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	user-select: none;
	border-radius: 10rem;
	transition: color .15s ease-in-out, background-color .15s ease-in-out, border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

/* Botão Add to cart – estilo primário (amarelo) */
.offer-blocks .btn-primary-new,
.btn-primary-new {
	cursor: pointer;
	background-color: #ffd814;
	border: none;
	color: #000;
	border: 1px solid #fcd200;
	font-weight: 600;
}

.offer-blocks .btn-primary-new:hover,
.btn-primary-new:hover {
	background-color: #f7ca00;
	text-decoration: none;
	color: #000;
}

/* Animação do botão (pulse) */
@keyframes pulse {
	0%, 100% { transform: scale(.9); opacity: .9; }
	50% { transform: scale(1); opacity: 1; }
}

@-webkit-keyframes pulse {
	0%, 100% { -webkit-transform: scale(.95); opacity: .7; }
	50% { -webkit-transform: scale(1); opacity: 1; }
}

.offer-blocks .btn-primary-new.cta,
.cta.btn-primary-new {
	animation: pulse 1.5s infinite alternate;
}