/**
 * Force Vehicle Elements Visible
 * Ensures all vehicle card elements (price, select button) are always visible
 */

/* Force all vehicle action columns to be visible */
html body .md-vehicle-action-col,
html body .md-vehicle-list-row .md-vehicle-action-col,
html body #vehicle-options-container .md-vehicle-action-col,
html body .vehicle-container .md-vehicle-action-col,
body .md-vehicle-action-col,
.md-vehicle-action-col {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  width: auto !important;
  min-width: 120px !important;
  height: auto !important;
  overflow: visible !important;
  position: relative !important;
  transform: none !important;
}

/* Force price wrapper to be visible */
html body .md-vehicle-price-wrapper,
html body .md-vehicle-list-row .md-vehicle-price-wrapper,
body .md-vehicle-price-wrapper,
.md-vehicle-price-wrapper {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  flex-direction: column !important;
  align-items: center !important;
  margin-bottom: 10px !important;
}

/* Force price display to be visible */
html body .md-vehicle-price,
html body .md-vehicle-list-row .md-vehicle-price,
body .md-vehicle-price,
.md-vehicle-price {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  font-size: 1.25rem !important;
  font-weight: 700 !important;
  color: #c22055 !important;
  margin: 5px 0 !important;
}

/* Force select button to be visible */
html body .md-select-vehicle-btn,
html body .md-vehicle-list-row .md-select-vehicle-btn,
html body .md-btn.md-select-vehicle-btn,
body .md-select-vehicle-btn,
.md-select-vehicle-btn {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  background-color: #c22055 !important;
  color: white !important;
  padding: 10px 20px !important;
  border-radius: 4px !important;
  text-align: center !important;
  cursor: pointer !important;
  pointer-events: auto !important;
  position: relative !important;
  transform: none !important;
  font-weight: 500 !important;
  text-transform: uppercase !important;
  border: none !important;
  box-shadow: 0 2px 4px rgba(0,0,0,0.2) !important;
}

/* Ensure button text is visible */
html body .md-select-vehicle-btn span,
.md-select-vehicle-btn span {
  display: inline !important;
  visibility: visible !important;
  opacity: 1 !important;
  color: white !important;
}

/* Force entire vehicle row to be visible */
html body .md-vehicle-list-row,
body .md-vehicle-list-row,
.md-vehicle-list-row {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: relative !important;
  transform: none !important;
  pointer-events: auto !important;
}

/* Ensure vehicle info is visible */
html body .md-vehicle-info-col,
body .md-vehicle-info-col,
.md-vehicle-info-col {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  flex: 1 !important;
}

/* Override any state-based hiding */
html body [data-state] .md-vehicle-action-col,
html body [data-state] .md-vehicle-price-wrapper,
html body [data-state] .md-vehicle-price,
html body [data-state] .md-select-vehicle-btn,
[data-state] .md-vehicle-action-col,
[data-state] .md-vehicle-price-wrapper,
[data-state] .md-vehicle-price,
[data-state] .md-select-vehicle-btn {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}

/* Specific overrides for browse state */
html body .vehicle-container[data-state="browse"] .md-vehicle-action-col,
html body .vehicle-container[data-state="browse"] .md-vehicle-price-wrapper,
html body .vehicle-container[data-state="browse"] .md-vehicle-price,
html body .vehicle-container[data-state="browse"] .md-select-vehicle-btn {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: auto !important;
}

/* Remove any filters or effects that might hide elements */
html body .md-vehicle-list-row *,
.md-vehicle-list-row * {
  filter: none !important;
  clip-path: none !important;
  mask: none !important;
}

/* Hover states for select button */
.md-select-vehicle-btn:hover {
  background-color: #a01d48 !important;
  box-shadow: 0 4px 8px rgba(0,0,0,0.3) !important;
  transform: translateY(-1px) !important;
}

/* Active state for select button */
.md-select-vehicle-btn:active {
  background-color: #8a1940 !important;
  transform: translateY(0) !important;
}

/* Ensure price is visible even when loading */
.md-vehicle-price.price-loading {
  display: block !important;
  visibility: visible !important;
  opacity: 0.7 !important;
}

/* Mobile specific overrides */
@media (max-width: 768px) {
  html body .md-vehicle-action-col,
  .md-vehicle-action-col {
    width: 100% !important;
    margin-top: 10px !important;
    padding: 10px !important;
  }
  
  html body .md-vehicle-list-row,
  .md-vehicle-list-row {
    flex-direction: column !important;
  }
}

/* Debug borders (remove in production) */
/*
.md-vehicle-action-col {
  border: 2px solid red !important;
}
.md-vehicle-price-wrapper {
  border: 2px solid blue !important;
}
.md-select-vehicle-btn {
  border: 2px solid green !important;
}
*/