/* ── Page ── */
  .stickers_page {
    font-family: var(--ff-body, 'Barlow', sans-serif);
    /* background: var(--color-background-secondary); */
    color: var(--color-text-primary);
  }

  /* ── Header ── */
  .stickers_header {
    background: var(--jeep-dark);
    border-bottom: 1px solid rgba(200,169,110,0.25);
  }
  .stickers_header_eyebrow {
    font-family: var(--ff-display, 'Barlow', sans-serif);
    font-size: 10px;
    letter-spacing: 0.18em;
    color: var(--jeep-tan);
  }
  .stickers_header_title {
    font-family: var(--ff-display, 'Barlow', sans-serif);
    font-size: 30px;
    letter-spacing: -0.01em;
    line-height: 1.05;
  }
  .stickers_header_sub {
    font-size: 13px;
    color: rgba(255,255,255,0.45);
  }

  /* ── Table wrapper ── */
  .stickers_table_wrap {
    border-color: var(--color-border-secondary) !important;
    background: var(--color-background-primary);
  }

  /* ── Table ── */
  .stickers_table {
    border-collapse: collapse;
  }
  .stickers_table > :not(caption) > * > * {
    background: transparent;
  }

  /* ── Head ── */
  .stickers_thead {
    background: #002349;
    border-bottom: 1px solid rgba(200,169,110,0.2);
  }
  .stickers_th {
    font-family: var(--ff-display, 'Barlow', sans-serif);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.16em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.8);
    padding: 10px 12px;
    border: none;
    white-space: nowrap;
  }

  /* ── Rows ── */
  .stickers_row {
    border-bottom: 0.5px solid var(--color-border-tertiary);
    transition: background 0.12s ease;
  }
  .stickers_row:last-child {
    border-bottom: none;
  }
  .stickers_row:hover {
    background: var(--color-background-secondary) !important;
  }
  .stickers_td {
    padding: 10px 12px;
    border: none;
    vertical-align: middle;
  }
  .stickers_td_photo {
    padding: 8px 12px;
    border: none;
    vertical-align: middle;
  }

  /* ── Thumbnail ── */
  .sticker_thumb_wrap {
    width: 110px;
    height: 70px;
    background: linear-gradient(150deg, rgba(200,169,110,0.07) 0%, var(--color-background-secondary) 100%);
  }
  .sticker_thumb_img {
    object-position: center bottom;
    padding: 4px 6px 2px;
  }
  .sticker_thumb_placeholder {
    color: var(--color-text-tertiary);
  }
  @media (max-width: 768px) {
    .sticker_thumb_wrap {
      width: 65px;
    }
    .sticker_thumb_img { padding: 0}
  }

  /* ── Vehicle name ── */
  .sticker_row_year {
    font-family: var(--ff-display, 'Barlow', sans-serif);
    font-size: 10px;
    letter-spacing: 0.12em;
    color: var(--jeep-tan);
    line-height: 1.2;
  }
  .sticker_row_make_model {
    font-family: var(--ff-display, 'Barlow', sans-serif);
    font-size: 14px;
    letter-spacing: -0.01em;
    color: var(--color-text-primary);
    max-width: 160px;
    line-height: 1.2;
  }

  /* ── VIN ── */
  .sticker_row_vin_label {
    font-size: 9px;
    letter-spacing: 0.14em;
    color: var(--color-text-tertiary);
    line-height: 1.3;
  }
  .sticker_row_vin {
    font-size: 11px;
    color: var(--color-text-secondary);
    letter-spacing: 0.05em;
    line-height: 1.3;
  }
  .sticker_row_vin_copy {
    font-size: 11px;
    color: var(--color-text-tertiary);
    text-decoration: none;
    cursor: pointer;
  }
  .sticker_row_vin_copy:hover {
    color: var(--color-text-primary);
  }

  /* ── Decoded ── */
  .sticker_row_decoded {
    font-size: 11px;
    color: var(--color-text-tertiary);
  }

  /* ── Costs ── */
  .sticker_row_cost {
    font-family: var(--ff-display, 'Barlow', sans-serif);
    font-size: 13px;
    color: var(--color-text-secondary);
    letter-spacing: -0.01em;
  }
  .sticker_row_msrp {
    font-family: var(--ff-display, 'Barlow', sans-serif);
    font-size: 14px;
    color: var(--color-text-primary);
    letter-spacing: -0.01em;
  }

  /* ── CTA ── */
  .sticker_row_cta {
    font-family: var(--ff-display, 'Barlow', sans-serif);
    font-size: 10px;
    letter-spacing: 0.06em;
    padding: 5px 10px;
    color: var(--jeep-tan);
    border: 1px solid var(--jeep-tan) !important;
    border-radius: var(--border-radius-sm, 6px) !important;
    transition: background 0.14s ease, color 0.14s ease, border-color 0.14s ease;
  }
  .sticker_row_cta:hover,
  .sticker_row_cta:focus {
    background: var(--jeep-tan) !important;
    color: var(--jeep-dark) !important;
    border-color: var(--jeep-tan) !important;
  }
  .sticker_row_cta__unavailable {
    font-size: 16px;
    color: var(--color-text-disabled);
    line-height: 1;
  }

  /* ── Empty state ── */
  .stickers_empty_icon {
    width: 72px;
    height: 72px;
    font-size:32px;
    background: var(--color-background-primary);
    border: 0.5px solid var(--color-border-secondary);
    color: var(--color-text-tertiary);
  }
  .stickers_empty_title {
    font-family: var(--ff-display, 'Barlow', sans-serif);
    font-size: 17px;
    color: var(--color-text-primary);
  }
  .stickers_empty_sub {
    font-size: 13px;
    color: var(--color-text-tertiary);
    line-height: 1.5;
  }

  /* ──────────────────────────────────────────────────────────────────────────
     Bootstrap utility shim (scoped)

     These components (UI::CarsTable / UI::CarThumbnail) and the hand-built admin
     index (app/admin/cars.rb) are shared with / mimic the main Bootstrap app, but
     ActiveAdmin is Tailwind-based and has no Bootstrap utilities. Without these,
     `d-md-none` etc. don't hide anything (mobile-fold block duplicates onto
     desktop, responsive columns never collapse) and `d-flex`/`fw-bold`/etc. no-op.

     Scoped under `.aa-bs-compat` — a marker class on the ActiveAdmin <body> (see
     app/views/layouts/active_admin.html.erb) so it covers every admin page (the
     dashboard AND resource indexes). It mirrors Bootstrap 5's exact values +
     breakpoints (md ≥768px, xl ≥1200px), and since `.aa-bs-compat` exists only in
     the admin, it is a total no-op in the main app where cars_table.css also loads.
     ────────────────────────────────────────────────────────────────────────── */

  /* Display */
  .aa-bs-compat .d-none        { display: none !important; }
  .aa-bs-compat .d-block       { display: block !important; }
  .aa-bs-compat .d-flex        { display: flex !important; }
  .aa-bs-compat .d-inline-flex { display: inline-flex !important; }
  @media (min-width: 768px) {
    .aa-bs-compat .d-md-none       { display: none !important; }
    .aa-bs-compat .d-md-table-cell { display: table-cell !important; }
  }
  @media (min-width: 1200px) {
    .aa-bs-compat .d-xl-table-cell { display: table-cell !important; }
  }

  /* Table */
  .aa-bs-compat .table        { width: 100%; }
  .aa-bs-compat .align-middle { vertical-align: middle !important; }

  /* Flexbox */
  .aa-bs-compat .align-items-center     { align-items: center !important; }
  .aa-bs-compat .justify-content-center { justify-content: center !important; }
  .aa-bs-compat .gap-1                  { gap: 0.25rem !important; }

  /* Text */
  .aa-bs-compat .text-center          { text-align: center !important; }
  .aa-bs-compat .text-end             { text-align: right !important; }
  .aa-bs-compat .text-uppercase       { text-transform: uppercase !important; }
  .aa-bs-compat .text-nowrap          { white-space: nowrap !important; }
  .aa-bs-compat .text-truncate        { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .aa-bs-compat .text-decoration-none { text-decoration: none !important; }
  .aa-bs-compat .fst-italic           { font-style: italic !important; }
  .aa-bs-compat .fw-light             { font-weight: 300 !important; }
  .aa-bs-compat .fw-semibold          { font-weight: 600 !important; }
  .aa-bs-compat .fw-bold              { font-weight: 700 !important; }
  .aa-bs-compat .font-monospace       { font-family: SFMono-Regular, Menlo, Monaco, Consolas, monospace !important; }

  /* Sizing / object-fit / overflow */
  .aa-bs-compat .w-100              { width: 100% !important; }
  .aa-bs-compat .h-100              { height: 100% !important; }
  .aa-bs-compat .object-fit-contain { object-fit: contain !important; }
  .aa-bs-compat .overflow-hidden    { overflow: hidden !important; }

  /* Rounding */
  .aa-bs-compat .rounded-2      { border-radius: 0.375rem !important; }
  .aa-bs-compat .rounded-3      { border-radius: 0.5rem !important; }
  .aa-bs-compat .rounded-circle { border-radius: 50% !important; }

  /* Border */
  .aa-bs-compat .border { border: 1px solid var(--color-border-secondary, #dee2e6) !important; }

  /* Spacing (Bootstrap scale: 1=.25rem, 2=.5rem, 3=1rem, 5=3rem) */
  .aa-bs-compat .mx-auto { margin-left: auto !important; margin-right: auto !important; }
  .aa-bs-compat .mt-1    { margin-top: 0.25rem !important; }
  .aa-bs-compat .mt-2    { margin-top: 0.5rem !important; }
  .aa-bs-compat .mb-0    { margin-bottom: 0 !important; }
  .aa-bs-compat .mb-2    { margin-bottom: 0.5rem !important; }
  .aa-bs-compat .mb-3    { margin-bottom: 1rem !important; }
  .aa-bs-compat .ps-3    { padding-left: 1rem !important; }
  .aa-bs-compat .pe-3    { padding-right: 1rem !important; }
  .aa-bs-compat .py-5    { padding-top: 3rem !important; padding-bottom: 3rem !important; }

  /* Opacity */
  .aa-bs-compat .opacity-40 { opacity: 0.4 !important; }