/**
 * Cart Compact Overrides
 * Aplicação rápida dos estilos compactos sem recompilar SCSS
 * 
 * Data: 2026-01-22
 * Uso: Adicionar após app.css no header
 */

/* ============================================================================
   PAGE HERO COMPACTO
   ============================================================================ */

.page-hero-compact-cart,
.page-hero.page-hero-compact-cart {
  padding: 1.25rem 1rem !important; /* 20px 16px */
  margin-bottom: 1.25rem !important; /* 20px */
}

.page-hero-compact-cart .page-hero-title {
  font-size: 1.5rem !important; /* 24px */
  margin-bottom: 0.5rem !important; /* 8px */
}

.page-hero-compact-cart .page-hero-subtitle {
  font-size: 1rem !important; /* 16px */
  margin-top: 0.25rem !important; /* 4px */
}

/* ============================================================================
   SEÇÃO "SELECIONE O PRODUTO" COMPACTA
   ============================================================================ */

.cart-product-section {
  margin-bottom: 1.25rem !important; /* 20px */
}

.cart-product-section .section-header {
  display: flex;
  align-items: center;
  gap: 0.75rem; /* 12px */
  margin-bottom: 1rem !important; /* 16px */
}

.cart-product-section .step-number {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: var(--brand-primary, #2305F1);
  color: white;
  font-size: 0.875rem; /* 14px */
  font-weight: 600;
  flex-shrink: 0;
}

.cart-product-section h3 {
  font-size: 1.125rem !important; /* 18px */
  font-weight: 600;
  margin: 0;
}

/* ============================================================================
   CARDS DE PRODUTOS COMPACTOS
   ============================================================================ */

.cart-product-card {
  height: 100%;
  display: flex;
  flex-direction: column;
  transition: all 0.25s ease;
  border: 1px solid var(--border-color, #EBECF0);
  border-radius: 0.75rem; /* 12px */
}

.cart-product-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
  border-color: var(--brand-primary, #2305F1);
}

.cart-product-card.selected {
  border-color: var(--brand-primary, #2305F1);
  border-width: 2px;
  box-shadow: 0 0 0 3px rgba(35, 5, 241, 0.1);
}

.cart-product-card .card-header {
  padding: 0.75rem 1rem !important; /* 12px 16px */
  border-bottom: 1px solid var(--border-color, #EBECF0);
}

.cart-product-card .card-title {
  font-size: 1.125rem !important; /* 18px */
  font-weight: 600;
  margin: 0;
  line-height: 1.25;
}

.cart-product-card .card-body {
  padding: 1rem !important; /* 16px */
}

.cart-product-card .card-description,
.cart-product-card .text-muted {
  font-size: 0.875rem !important; /* 14px */
  line-height: 1.5;
  margin-bottom: 0.75rem !important; /* 12px */
}

.cart-product-card .form-control {
  font-size: 0.875rem !important; /* 14px */
  padding: 0.5rem 0.75rem !important; /* 8px 12px */
}

.cart-product-card .btn {
  padding: 0.5rem 1rem !important; /* 8px 16px */
  font-size: 0.875rem !important; /* 14px */
  font-weight: 500;
}

/* ============================================================================
   GRID DE PRODUTOS OTIMIZADO
   ============================================================================ */

.cart-products-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1rem !important; /* 16px */
}

@media (max-width: 768px) {
  .cart-products-grid {
    grid-template-columns: 1fr;
    gap: 0.75rem !important; /* 12px */
  }
}

/* ============================================================================
   REDUZIR ESPAÇAMENTOS GERAIS
   ============================================================================ */

#orderpage .cart-product {
  margin-bottom: 1.25rem !important; /* 20px ao invés de 48px */
}

#orderpage .mb-5 {
  margin-bottom: 1.25rem !important; /* 20px */
}

#orderpage .mb-4 {
  margin-bottom: 1rem !important; /* 16px */
}

#orderpage .mb-3 {
  margin-bottom: 0.75rem !important; /* 12px */
}

/* ============================================================================
   RESPONSIVIDADE
   ============================================================================ */

@media (max-width: 768px) {
  .page-hero-compact-cart {
    padding: 1rem !important; /* 16px */
    margin-bottom: 1rem !important; /* 16px */
  }
  
  .page-hero-compact-cart .page-hero-title {
    font-size: 1.25rem !important; /* 20px */
  }
  
  .page-hero-compact-cart .page-hero-subtitle {
    font-size: 0.875rem !important; /* 14px */
  }
  
  .cart-product-card .card-header {
    padding: 0.5rem 0.75rem !important; /* 8px 12px */
  }
  
  .cart-product-card .card-body {
    padding: 0.75rem !important; /* 12px */
  }
  
  .cart-product-card .card-title {
    font-size: 1rem !important; /* 16px */
  }
  
  .cart-product-section h3 {
    font-size: 1rem !important; /* 16px */
  }
}