/* Paleta de cores */
:root {
  --main-color: #127B8c;
  --secondary-color: #47CFE0;
}

body { background: #f8fafc; }
.category-list { min-width: 220px; }
.product-card { transition: box-shadow .2s; }
.product-card:hover { box-shadow: 0 0 16px 0 rgba(0,0,0,.10); }
.product-img { height: 180px; object-fit: cover; border-radius: 0.5rem 0.5rem 0 0; }
.navbar-brand { font-weight: bold; letter-spacing: 2px; color: var(--main-color)!important; }
.navbar-light .navbar-nav .nav-link.active, .navbar-light .navbar-nav .show>.nav-link {
  color: #fff;
  background: linear-gradient(90deg, var(--main-color) 70%, var(--secondary-color) 100%);
  border-radius: 0.5rem;
}
.navbar-light .navbar-nav .nav-link:hover {
  color: var(--main-color);
}
.btn-primary, .product-card .btn-primary {
  background: var(--main-color);
  border: none;
  color: #fff;
}
.btn-primary:hover, .product-card .btn-primary:hover {
  background: var(--secondary-color);
  color: #fff;
}
.border-primary {
  border-color: var(--main-color)!important;
}
.text-primary {
  color: var(--main-color)!important;
}
.bg-primary, .banner-bg {
  background: linear-gradient(90deg, var(--main-color) 60%, var(--secondary-color) 100%)!important;
}

/* Área de destaque dos botões app/accordion */
.app-action-area {
  background: #f2fcff;
  border-radius: 1.25rem;
  box-shadow: 0 2px 16px 0 rgba(18,123,140,0.08);
  padding: 2rem 1rem 1.5rem 1rem;
  margin-bottom: 2.5rem;
  border: 1px solid #e1f3f8;
}
@media (max-width: 576px) {
  .app-action-area {
    padding: 1.2rem 0.5rem 1rem 0.5rem;
  }
}

/* Botões de categoria customizados */
.btn-categoria {
  background: var(--main-color);
  color: #fff !important;
  border: none;
  box-shadow: 0 2px 8px 0 rgba(18,123,140,0.07);
  transition: background 0.3s, color 0.3s, box-shadow 0.2s;
}
.btn-categoria:hover, .btn-categoria:focus {
  background: var(--secondary-color);
  color: #fff !important;
  box-shadow: 0 4px 16px 0 rgba(18,123,140,0.13);
}

.banner-gradient {
  background: linear-gradient(90deg, var(--main-color) 60%, var(--secondary-color) 100%)!important;
  color: #fff;
}
.rounded-4 { border-radius: 1.5rem!important; }

/* Ajustes para página de produto */
.product-gallery { max-width: 480px; }
.product-img-lg { width: 100%; height: 340px; object-fit: cover; border-radius: 0.5rem; }
.thumb-img { width: 70px; height: 70px; object-fit: cover; border-radius: 0.5rem; cursor: pointer; border: 2px solid #eee; margin-right: 8px; }
.thumb-img.active { border: 2px solid var(--main-color); }
.price-tag { font-size: 2rem; color: var(--main-color); font-weight: bold; }
.buy-btn { font-size: 1.1rem; }
