/* TransTrade Marketplace 1.0.1 — dopracowanie pod makietę */
.ttmkt{
  --blue:#0870f8;
  --navy:#07142f;
  --muted:#69758d;
  --line:#dfe7f1;
  width:100%;
  padding:88px 0 58px;
  background:
    radial-gradient(circle at 94% 13%, rgba(71,145,255,.055), transparent 24%),
    #fff;
  color:var(--navy);
  font-family:Poppins,Arial,sans-serif;
}
.ttmkt__container{
  width:calc(100% - 40px);
  max-width:1200px;
  margin:0 auto;
}
.ttmkt__head{
  margin-bottom:22px;
}
.ttmkt__kicker{
  display:flex;
  align-items:center;
  gap:10px;
  color:var(--blue);
  font-size:13px;
  line-height:1.25;
  font-weight:600;
  text-transform:uppercase;
}
.ttmkt__kicker i{font-size:17px}
.ttmkt__head h2{
  margin:9px 0 8px;
  color:var(--navy);
  font-size:48px;
  line-height:1.04;
  letter-spacing:-1.9px;
  font-weight:650;
}
.ttmkt__head p{
  margin:0;
  color:#4d5b73;
  font-size:14px;
  line-height:1.5;
}

.ttmkt__tabs{
  display:flex;
  gap:0;
  margin-bottom:-1px;
}
.ttmkt__tabs button{
  height:52px;
  min-width:165px;
  padding:0 28px;
  border:1px solid var(--line);
  background:#fff;
  color:#182943;
  font:600 13px Poppins,Arial,sans-serif;
  cursor:pointer;
}
.ttmkt__tabs button:first-child{border-radius:9px 0 0 0}
.ttmkt__tabs button:last-child{border-radius:0 9px 0 0}
.ttmkt__tabs button i{margin-right:10px;font-size:15px}
.ttmkt__tabs button.is-active{
  color:var(--blue);
  border-top:2px solid var(--blue);
  border-bottom-color:#fff;
}

.ttmkt__filters{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:14px 20px;
  padding:19px 18px 17px;
  border:1px solid var(--line);
  border-radius:0 11px 11px 11px;
  background:#fff;
  box-shadow:0 8px 24px rgba(27,54,90,.055);
}
.ttmkt__filters>label>span{
  display:block;
  margin:0 0 7px;
  color:#12203c;
  font-size:11px;
  font-weight:600;
}
.ttmkt__filters label>div{
  height:46px;
  display:flex;
  align-items:center;
  gap:11px;
  padding:0 14px;
  border:1px solid #dce5f0;
  border-radius:7px;
  color:#50617c;
  background:#fff;
}
.ttmkt__filters label>div>i{
  color:#355476;
  font-size:15px;
}
.ttmkt__filters select,
.ttmkt__filters input{
  width:100%;
  min-width:0;
  border:0;
  outline:0;
  background:transparent;
  color:#53627b;
  font:400 11.5px Poppins,Arial,sans-serif;
}
.ttmkt__price input{min-width:0}
.ttmkt__price b{font-weight:400;color:#748198}
.ttmkt__price em{
  color:#6f7a8f;
  font-size:10.5px;
  font-style:normal;
}

.ttmkt__verified{
  grid-column:1/2;
  align-self:end;
}
.ttmkt__verified>div{
  height:54px!important;
  border-color:#dce5f0!important;
}
.ttmkt__verified>div>i{
  color:var(--blue)!important;
  font-size:19px!important;
}
.ttmkt__verified span{
  flex:1;
  display:flex!important;
  flex-direction:column;
}
.ttmkt__verified b{
  color:#172743;
  font-size:11px;
}
.ttmkt__verified small{
  margin-top:2px;
  color:#8994a8;
  font-size:8.5px;
}
.ttmkt__verified input{
  width:38px!important;
  height:20px;
  accent-color:var(--blue);
}

.ttmkt__actions{
  grid-column:3/5;
  display:flex;
  align-items:end;
  justify-content:flex-end;
  gap:12px;
}
.ttmkt__actions button{
  height:46px;
  padding:0 20px;
  border:0;
  background:#fff;
  color:#1268da;
  font:500 11px Poppins,Arial,sans-serif;
  cursor:pointer;
}
.ttmkt__actions button.primary{
  min-width:140px;
  border-radius:7px;
  color:#fff;
  background:linear-gradient(135deg,#0768ec,#0b7cff);
  box-shadow:0 7px 16px rgba(8,112,248,.16);
}
.ttmkt__actions i{margin-right:8px}

.ttmkt__content{
  display:grid;
  grid-template-columns:minmax(0,1fr) 325px;
  gap:15px;
  margin-top:12px;
}
.ttmkt__results{
  border:1px solid var(--line);
  border-radius:11px;
  overflow:hidden;
  background:#fff;
  box-shadow:0 5px 18px rgba(27,54,90,.035);
}
.ttmkt__bar{
  min-height:54px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 16px;
  border-bottom:1px solid #e6ecf3;
}
.ttmkt__bar strong{
  color:#17243d;
  font-size:11px;
}
.ttmkt__bar div{
  display:flex;
  align-items:center;
  gap:9px;
  color:#69758b;
  font-size:9.5px;
}
.ttmkt__bar select{
  min-width:125px;
  height:32px;
  padding:0 8px;
  border:1px solid #dce4ee;
  border-radius:5px;
  background:#fff;
  font:400 9.5px Poppins,Arial,sans-serif;
}

.ttmkt__row{
  display:grid;
  grid-template-columns:64px minmax(170px,1.4fr) 134px 88px minmax(125px,1fr) minmax(150px,1.2fr) 116px;
  align-items:center;
  min-height:116px;
  padding:10px 12px;
  border-bottom:1px solid #e8edf3;
  gap:8px;
  background:#fff;
}
.ttmkt__row:hover{background:#fbfdff}
.ttmkt__row:last-of-type{border-bottom:0}

.ttmkt__status{
  align-self:start;
  margin-top:9px;
  width:max-content;
  padding:5px 8px;
  border-radius:4px;
  color:#fff;
  font-size:8.5px;
  font-weight:600;
}
.ttmkt__status.active{background:#33a64a}
.ttmkt__status.new{background:#1681f5}
.ttmkt__status.urgent{background:#ff7a18}

.ttmkt__route strong{
  display:block;
  color:#101e39;
  font-size:14px;
  line-height:1.25;
}
.ttmkt__route strong i{
  margin:0 6px;
  color:#667792;
  font-size:9px;
}
.ttmkt__route span{
  display:block;
  margin-top:4px;
  color:#586883;
  font-size:9px;
}
.ttmkt__route small{
  display:block;
  margin-top:7px;
  color:#4f607b;
  font-size:9px;
}
.ttmkt__route small i{margin-right:6px;color:#506784}

.ttmkt__vehicle{
  min-height:62px;
  display:flex;
  align-items:center;
  gap:10px;
  padding-left:13px;
  border-left:1px solid #e2e8ef;
}
.ttmkt__vehicle>i{
  color:#345275;
  font-size:19px;
}
.ttmkt__vehicle b,
.ttmkt__vehicle span{
  display:block;
}
.ttmkt__vehicle b{
  color:#1d2d49;
  font-size:9.5px;
  line-height:1.35;
}
.ttmkt__vehicle span{
  margin-top:3px;
  color:#68768d;
  font-size:8.5px;
}

.ttmkt__budget{
  min-height:62px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding-left:12px;
  border-left:1px solid #e2e8ef;
}
.ttmkt__budget strong{
  color:#102342;
  font-size:12px;
}
.ttmkt__budget span{
  margin-top:4px;
  color:#6d798d;
  font-size:8.5px;
}

.ttmkt__req{
  min-height:62px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  padding-left:12px;
  border-left:1px solid #e2e8ef;
}
.ttmkt__req b{
  color:#1e2f4c;
  font-size:8.7px;
}
.ttmkt__req span{
  margin-top:4px;
  color:#65728a;
  font-size:8.2px;
  line-height:1.5;
}

.ttmkt__company{
  display:flex;
  align-items:center;
  gap:10px;
}
.ttmkt__avatar{
  width:48px;
  height:48px;
  flex:0 0 48px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid #d9e3ef;
  border-radius:50%;
  background:linear-gradient(145deg,#fff,#f2f7fd);
  color:#24476f;
}
.ttmkt__avatar i{font-size:22px}
.ttmkt__company b{
  display:block;
  color:#172743;
  font-size:9px;
  line-height:1.25;
}
.ttmkt__company b i{
  color:var(--blue);
  font-size:8px;
}
.ttmkt__company span{
  display:block;
  margin-top:5px;
  color:#243551;
  font-size:9px;
}
.ttmkt__company span i{color:#ffb400}
.ttmkt__company small{color:#7c8799}

.ttmkt__row-actions{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.ttmkt__row-actions a{
  height:32px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid #c9d6e6;
  border-radius:5px;
  color:#18314f!important;
  background:#fff;
  text-decoration:none!important;
  font-size:8.5px;
  font-weight:500;
}
.ttmkt__row-actions a.primary{
  border-color:var(--blue);
  background:linear-gradient(135deg,#096be9,#087cff);
  color:#fff!important;
}

.ttmkt__matches{
  padding:16px 14px;
  border:1px solid var(--line);
  border-radius:11px;
  background:#fff;
  box-shadow:0 5px 18px rgba(27,54,90,.035);
}
.ttmkt__matches h3{
  margin:0;
  color:#17233c;
  font-size:13.5px;
}
.ttmkt__matches h3 i{
  margin-right:9px;
  color:var(--blue);
}
.ttmkt__matches>p{
  margin:5px 0 12px;
  color:#68758c;
  font-size:9.5px;
}
.ttmkt__match{
  padding:13px 0;
  border-top:1px solid #e8edf3;
}
.ttmkt__match>div:first-child{
  display:flex;
  justify-content:space-between;
  gap:10px;
}
.ttmkt__match strong{
  color:#182844;
  font-size:10.5px;
}
.ttmkt__match em{
  color:#36a64d;
  font-size:8.5px;
  font-style:normal;
  font-weight:600;
}
.ttmkt__match>span{
  display:block;
  margin-top:6px;
  color:#62708a;
  font-size:8.5px;
}
.ttmkt__match>b{
  display:block;
  margin-top:6px;
  color:#172b49;
  font-size:9.5px;
}
.ttmkt__match-company{
  display:grid!important;
  grid-template-columns:1fr auto auto;
  align-items:center;
  gap:6px;
  margin-top:8px;
}
.ttmkt__match-company small{font-size:8px}
.ttmkt__match-company span{font-size:8.5px}
.ttmkt__match-company span i{color:#ffb400}
.ttmkt__match-company a{
  padding:6px 8px;
  border:1px solid #cbd8e8;
  border-radius:4px;
  color:#1267d6;
  text-decoration:none;
  font-size:8px;
}
.ttmkt__all{
  height:40px;
  margin-top:7px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  color:#0a66df!important;
  text-decoration:none!important;
  font-size:9.5px;
}

.ttmkt__empty{
  padding:28px;
  text-align:center;
  color:#6a768d;
}
.ttmkt__row[hidden]{display:none}

@media(max-width:1100px){
  .ttmkt__filters{grid-template-columns:1fr 1fr}
  .ttmkt__verified{grid-column:auto}
  .ttmkt__actions{grid-column:1/3}
  .ttmkt__content{grid-template-columns:1fr}
  .ttmkt__row{
    grid-template-columns:58px minmax(170px,1.4fr) 130px 86px minmax(130px,1fr) minmax(150px,1fr);
  }
  .ttmkt__row-actions{
    grid-column:1/-1;
    flex-direction:row;
    justify-content:flex-end;
  }
  .ttmkt__row-actions a{min-width:130px}
}
@media(max-width:720px){
  .ttmkt{padding-top:60px}
  .ttmkt__container{width:calc(100% - 28px)}
  .ttmkt__head h2{font-size:36px}
  .ttmkt__head p{font-size:13px}
  .ttmkt__filters{grid-template-columns:1fr}
  .ttmkt__actions{grid-column:auto}
  .ttmkt__tabs{overflow:auto}
  .ttmkt__row{
    grid-template-columns:1fr 1fr;
    gap:14px;
    padding:15px;
  }
  .ttmkt__status{grid-column:1/-1}
  .ttmkt__req,.ttmkt__budget,.ttmkt__vehicle{
    min-height:auto;
    border-left:0;
    padding-left:0;
  }
  .ttmkt__company{grid-column:1/-1}
  .ttmkt__row-actions{grid-column:1/-1}
}


/* =========================================================
   1.0.2 — dopracowanie pod makietę referencyjną
   ========================================================= */

/* więcej oddechu i lepsze proporcje całego modułu */
.ttmkt{
  padding-top:82px!important;
}
.ttmkt__container{
  max-width:1200px!important;
}

/* panel wyników trochę szerszy, sidebar bardziej kontrolowany */
.ttmkt__content{
  grid-template-columns:minmax(0, 1fr) 285px!important;
  gap:14px!important;
}

/* wiersze ofert — układ bliższy makiecie, bez ściskania firmy i przycisków */
.ttmkt__row{
  grid-template-columns:
    58px
    minmax(175px,1.45fr)
    122px
    82px
    minmax(122px,.95fr)
    minmax(155px,1.18fr)
    108px!important;
  min-height:112px!important;
  padding:10px 10px!important;
  column-gap:7px!important;
}

.ttmkt__route strong{
  font-size:13.5px!important;
}
.ttmkt__route span,
.ttmkt__route small{
  font-size:8.7px!important;
}

.ttmkt__vehicle{
  min-width:0!important;
  gap:8px!important;
  padding-left:10px!important;
}
.ttmkt__vehicle b{
  font-size:8.7px!important;
  line-height:1.25!important;
}
.ttmkt__vehicle span{
  font-size:7.8px!important;
}

.ttmkt__budget{
  padding-left:9px!important;
}
.ttmkt__budget strong{
  font-size:10.8px!important;
}

.ttmkt__req{
  padding-left:9px!important;
  overflow:hidden!important;
}
.ttmkt__req b{
  font-size:8px!important;
}
.ttmkt__req span{
  font-size:7.5px!important;
  line-height:1.35!important;
  display:-webkit-box!important;
  -webkit-line-clamp:3!important;
  -webkit-box-orient:vertical!important;
  overflow:hidden!important;
}

/* firma — brak łamania nazwy w losowych miejscach */
.ttmkt__company{
  min-width:0!important;
  gap:8px!important;
}
.ttmkt__avatar{
  width:44px!important;
  height:44px!important;
  flex-basis:44px!important;
}
.ttmkt__company>div{
  min-width:0!important;
}
.ttmkt__company b{
  font-size:8.3px!important;
  line-height:1.25!important;
  white-space:normal!important;
  word-break:normal!important;
  overflow-wrap:break-word!important;
}
.ttmkt__company span{
  font-size:8px!important;
  white-space:nowrap!important;
}

/* przyciski po prawej — stała szerokość i brak obcinania */
.ttmkt__row-actions{
  width:108px!important;
}
.ttmkt__row-actions a{
  width:100%!important;
  height:31px!important;
  padding:0 5px!important;
  box-sizing:border-box!important;
  white-space:nowrap!important;
  font-size:7.6px!important;
}

/* sidebar inteligentnych dopasowań */
.ttmkt__matches{
  min-width:0!important;
  padding:14px 12px!important;
}
.ttmkt__matches h3{
  font-size:12px!important;
  line-height:1.3!important;
}
.ttmkt__matches>p{
  font-size:8.6px!important;
}

.ttmkt__match{
  padding:12px 0!important;
}
.ttmkt__match>div:first-child{
  align-items:flex-start!important;
}
.ttmkt__match strong{
  font-size:9px!important;
  line-height:1.35!important;
}
.ttmkt__match em{
  flex:0 0 auto!important;
  font-size:7.6px!important;
  white-space:nowrap!important;
}
.ttmkt__match>span{
  font-size:7.5px!important;
}
.ttmkt__match>b{
  font-size:8.4px!important;
}

/* najważniejsza poprawka: firma + rating + przycisk nie nachodzą na siebie */
.ttmkt__match-company{
  display:grid!important;
  grid-template-columns:minmax(0,1fr) auto!important;
  grid-template-areas:
    "company rating"
    "button button"!important;
  gap:5px 8px!important;
  align-items:center!important;
}
.ttmkt__match-company small{
  grid-area:company!important;
  min-width:0!important;
  font-size:7.8px!important;
  line-height:1.3!important;
  white-space:normal!important;
  overflow-wrap:anywhere!important;
}
.ttmkt__match-company span{
  grid-area:rating!important;
  font-size:7.7px!important;
  white-space:nowrap!important;
}
.ttmkt__match-company a{
  grid-area:button!important;
  width:100%!important;
  box-sizing:border-box!important;
  text-align:center!important;
  padding:6px 8px!important;
  font-size:7.7px!important;
  white-space:nowrap!important;
}

/* większy i czytelniejszy dolny link */
.ttmkt__all{
  margin-top:8px!important;
  min-height:38px!important;
  font-size:8.7px!important;
}

/* filtry — trochę bardziej podobne do referencji */
.ttmkt__filters{
  padding:17px 16px 15px!important;
  gap:12px 18px!important;
}
.ttmkt__filters label>div{
  height:44px!important;
}
.ttmkt__verified>div{
  height:50px!important;
}
.ttmkt__actions button{
  height:44px!important;
}
.ttmkt__actions button.primary{
  min-width:132px!important;
}

/* sortowanie */
.ttmkt__bar{
  min-height:50px!important;
}
.ttmkt__bar select{
  min-width:110px!important;
}

/* zachowanie przy szerokościach pośrednich */
@media (max-width:1180px){
  .ttmkt__content{
    grid-template-columns:minmax(0,1fr) 270px!important;
  }
  .ttmkt__row{
    grid-template-columns:
      56px
      minmax(155px,1.35fr)
      112px
      78px
      minmax(110px,.9fr)
      minmax(135px,1fr)
      102px!important;
  }
  .ttmkt__row-actions{
    width:102px!important;
  }
}

/* poniżej 1020px przechodzimy do bezpieczniejszego layoutu */
@media (max-width:1020px){
  .ttmkt__content{
    grid-template-columns:1fr!important;
  }
  .ttmkt__row{
    grid-template-columns:
      58px
      minmax(175px,1.5fr)
      130px
      86px
      minmax(130px,1fr)
      minmax(155px,1fr)!important;
  }
  .ttmkt__row-actions{
    grid-column:1/-1!important;
    width:auto!important;
    flex-direction:row!important;
    justify-content:flex-end!important;
  }
  .ttmkt__row-actions a{
    width:auto!important;
    min-width:135px!important;
  }
}


/* =========================================================
   1.0.5 — centrowanie ikon firm + brak przesuniętych kółek
   ========================================================= */
.ttmkt__company > .ttmkt__avatar{
    width:44px!important;
    height:44px!important;
    flex:0 0 44px!important;
    margin:0!important;
    padding:0!important;
    display:flex!important;
    align-items:center!important;
    justify-content:center!important;
    border-radius:50%!important;
    box-sizing:border-box!important;
    line-height:1!important;
}
.ttmkt__company > .ttmkt__avatar > i{
    margin:0!important;
    padding:0!important;
    color:#24476f!important;
    font-size:20px!important;
    line-height:1!important;
    transform:none!important;
}
.ttmkt__company > .ttmkt__avatar + div > span{
    margin-top:4px!important;
}
