/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *
 *= require_tree .
 *= require_self
 */

/* Mobile 2-column grid */
@media (max-width: 768px) {
  .car-grid {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 8px !important;
  }

  .car-image,
  .car-image-placeholder {
    height: 100px !important;
  }

  .car-content {
    padding: 8px !important;
  }

  .car-title {
    font-size: 0.75rem !important;
    margin-bottom: 4px !important;
  }

  .car-price {
    font-size: 0.9rem !important;
    margin-bottom: 4px !important;
  }

  .car-meta {
    font-size: 0.6rem !important;
  }

  .container {
    padding: 8px !important;
  }
}