/* === 3 equal columns wrapper === */
.threecol{
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 24px !important;
  align-items: start !important;
}

#msg_text {
	margin-right: 5px;
}
#msg_field {
	margin-right: 5px;
}
#select_box {
	position: relative;
	margin-top: 10px;
	margin-left: 25px;	
}
#cot {
	position: inherit;
	vertical-align: inherit;
}
.odoImageBox {
	width:auto;
	position: relative;
	margin-top: 10px;
	margin-left: 5px;
    border-left: 2px solid #ADC3DE;
}

/* One car per row — the <a> is the grid container */
.car-row{
  display:grid !important;
  grid-template-columns:120px 1fr 1fr 1fr !important; /* image + 3 cols */
  gap:6px 16px !important;
  align-items:start !important;

  padding:12px 16px !important;
  margin:0 0 12px 0 !important;
  border:0 !important;                 /* no separator lines */
  text-decoration:none !important;
  color:#3b5d14 !important;
  font-weight:600 !important;
  font-size:16px !important;
  background:transparent !important;
}

/* Nuke any legacy absolute/margins and stray <br> from $imgHtml */
.car-row *{ position:static !important; margin:0 !important; display:block !important; }
.car-row br, .car-row hr{ display:none !important; }

/* Picture spans three rows on the left */
.car-row .picture{ grid-column:1; grid-row:1 / span 3; }
.car-row .picture img{ max-width:100%; height:auto; display:block; }

/* Column 1 */
.car-row .make{  grid-column:2; grid-row:1; font-size:12px; }
.car-row .model{ grid-column:2; grid-row:2; font-size:12px; }
.car-row .year{  grid-column:2; grid-row:3; }

/* Column 2 */
.car-row .miles{ grid-column:3; grid-row:1; }
.car-row .color{ grid-column:3; grid-row:2; }
.car-row .ends{  grid-column:3; grid-row:3; }

/* Column 3 */
.car-row .zip{   grid-column:4; grid-row:1; }
.car-row .price{ grid-column:4; grid-row:2; }
.car-row .bids{  grid-column:4; grid-row:3; }

/* Hover */
.car-row:hover{ background:#f5f5f5; color:red !important; }

/* Mobile: collapse to 2 columns (image + text) */
@media (max-width:640px){
  .car-row{ grid-template-columns:90px 1fr !important; }
  .car-row .picture{ grid-row:1 / span 9; }
  .car-row .make,.car-row .model,.car-row .year,
  .car-row .miles,.car-row .color,.car-row .ends,
  .car-row .zip,.car-row .price,.car-row .bids{ grid-column:2; }
}

.car-row {
  border-bottom: 1px solid #e3e3e3 !important;
  padding-bottom: 12px !important;   /* keeps text off the line */
  margin-bottom: 12px !important;    /* space before the next row */
}

/* optional: no line after the very last one */
.car-row:last-of-type { border-bottom: 0 !important; }

/* Shared fixed-width container for ALL sections */
.container{
  max-width: 1200px;           /* pick the width you want to align to */
  margin: 0 auto;              /* centers it */
  padding: 0 5px;             /* inner breathing room */
  box-sizing: border-box;
}

/* Optional: full-width colored bands */
.band{ width: 100%; }
.band-hero,
.band-research,
.band-partner,
.band-latest{ background: #fff; }  /* your purple */
.band-hero .container,
.band-research .container,
.band-partner .container,
.band-latest .container{ background: #fff; } /* content stays on white */

/* Top bar layout */
.topbar{ background: transparent; }
.header-row{
  display: flex;
  align-items: center;
  justify-content: space-between;   /* left text on left, links on right */
  gap: 16px;
  padding: 8px 0;
}

/* Utility links on the right */
.util-nav{
  display: flex;
  align-items: center;
  white-space: nowrap;              /* keeps Help on one line */
  gap: 0;
}
.util-nav a{
  text-decoration: none;
  color: #2f54eb;                   /* your link color */
}
.util-nav a + a::before{
  content: "|";
  margin: 0 8px;
  opacity: .8;
}

/* Safety: no ancestor clipping the right edge */
.topbar, .band, .container{ overflow: visible; }

.container > table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0 !important;   /* neutralize HTML cellspacing */
}

/* your helper table adds side padding—turn it off */
#table_margin { padding: 0 !important; margin-top: 8px; }

/* === Partner section: make it as wide as the car list === */

/* 1) The wrapper should span the full container */
.band-partner #textAdsWrapper,
.band-research #textAdsWrapper{
  width: 100% !important;
  max-width: none !important;
  margin: 0 !important;
  padding: 0 !important;
  box-sizing: border-box;
}

/* 2) Normalize the inner list and kill legacy fixed widths/floats */
#textAdsWrapper .textAds{
  width: 100% !important;
  display: grid !important;
  grid-template-columns: repeat(3, 1fr);  /* 3 columns like your screenshot */
  gap: 16px;
}
#textAdsWrapper .textAd1,
#textAdsWrapper .textAd2,
#textAdsWrapper .textAd3,
#textAdsWrapper .textAd4{
  width: auto !important;
  float: none !important;
  padding: 12px 16px;
  border-left: 1px solid #e5e5e5;
}
#textAdsWrapper .textAd1{ border-left: 0; }  /* no line on the first card */

/* 3) Label spans full width and aligns with container edges */
#textAdsWrapper .advertLabel{
  margin: 8px 0 12px;
  padding: 0;
}

/* 4) Tables/images inside cannot push the width */
.band-partner .container table,
.band-research .container table{ width:100%; border-collapse:collapse; border-spacing:0; }
.band-partner .container img,
.band-research .container img{ max-width:100%; height:auto; display:block; }

/* 5) Responsive: collapse columns */
@media (max-width: 1000px){ #textAdsWrapper .textAds{ grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px){  #textAdsWrapper .textAds{ grid-template-columns: 1fr; } }

/* Panel shell */
.panel{border:1px solid #AAA;border-radius:4px;overflow:hidden;margin:0 0 12px;background:#fff}
.panel-header{background:#cfd8e6; /* or your .titleBarColor */
  display:flex;align-items:center;height:35px;padding:0 10px;font-weight:700}
.panel-body{padding:12px}

/* 3-column layout inside the panel */
.uc-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px}
.uc-box{border:1px solid #e5e5e5;border-radius:6px;padding:10px}
.uc-box h3{margin:0 0 6px;font-size:14px}

/* mini action bar */
.uc-actions{display:flex;gap:8px;margin-top:12px}
.uc-actions button{padding:8px 12px;border:1px solid #bbb;border-radius:6px;background:#f7f7f7;cursor:pointer}
.uc-actions button:disabled{opacity:.5;cursor:not-allowed}

/* text helpers */
.uc-muted{opacity:.8;font-size:12px}