/* Offer card composition: request -> proposal -> supplier -> decision */
.offer-card-pro{
  display: grid;
  gap: 16px;
  padding: 18px;
  border: 1px solid rgba(18, 28, 24, 0.28);
  box-shadow: 0 22px 30px -24px rgba(18, 28, 24, 0.32);
}

.offer-card-head{
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 14px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--border);
}

.offer-card-label{
  display: block;
  margin-bottom: 6px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 780;
  letter-spacing: 0.01em;
}

.offer-request-title{
  max-width: 560px;
  font-size: 18px;
  font-weight: 860;
  line-height: 1.22;
}

.offer-proposal,
.offer-company-block,
.offer-comment{
  display: grid;
  gap: 8px;
}

.offer-proposal{
  padding-bottom: 12px;
  border-bottom: 1px solid var(--border);
}

.offer-message{
  margin: 0;
  padding: 10px 12px;
  color: var(--text-soft);
  background: #fff;
  border: 0;
  border-left: 3px solid #bfd0ca;
  border-radius: 0;
  box-shadow: 0 18px 24px -22px rgba(18, 28, 24, 0.18);
}

.offer-actions{
  padding-top: 2px;
  border-top: 1px solid var(--border);
}

.deal-workspace{
  display: grid;
  gap: var(--space-6);
}

.deal-group{
  display: grid;
  gap: 14px;
}

.deal-group-head{
  display: flex;
  gap: 16px;
  align-items: end;
  justify-content: space-between;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--border);
}

.deal-group-head h3{
  margin: 0;
  font-size: 20px;
}

.deal-group-head p{
  margin: 3px 0 0;
  color: var(--muted);
  font-size: 13px;
  font-weight: 650;
}

.deal-group-head strong{
  font-size: 26px;
  line-height: 1;
}

.deal-card{
  display: grid;
  gap: 14px;
  padding: 18px;
  background: #fff;
  border: 1px solid rgba(18, 28, 24, 0.28);
  box-shadow: 0 22px 30px -24px rgba(18, 28, 24, 0.32);
}

.deal-card-main{
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 16px;
  align-items: start;
}

.deal-card h3{
  margin: 0;
  font-size: 18px;
  line-height: 1.25;
}

.deal-actions{
  display: flex;
  gap: 8px;
  align-items: center;
  justify-content: flex-end;
  flex-wrap: wrap;
}

.deal-offer-line{
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
  padding-top: 12px;
  border-top: 1px solid var(--border);
  color: var(--text-soft);
  font-size: 14px;
  font-weight: 650;
}

.deal-empty{
  padding: 16px 0;
  color: var(--muted);
  font-size: 14px;
  font-weight: 650;
}

@media (max-width: 760px) {
.filter-chips{
    width: auto;
    gap: 16px;
    overflow-x: auto;
    white-space: nowrap;
  }
}

/* Design refresh: clean industrial marketplace UI */
.nav-badge,
.offer-tabs span,
.mobile-nav-badge{
  color: var(--primary);
  background: var(--primary-soft);
  border: 1px solid var(--primary-border);
  box-shadow: none;
}

.market-card:hover{
  background: var(--surface);
  box-shadow: var(--shadow-nested-hover);
  transform: translateY(-1px);
}

.panel-head p,
.muted,
.request-title span{
  color: var(--text-muted);
}

input::placeholder,
textarea::placeholder{
  color: var(--text-faint);
}

.accepted-card,
.best-offer-row td{
  background: var(--surface);
  border-color: #bbf7d0;
}

.accepted-card,
.best-offer-row td:first-child{
  box-shadow: inset 3px 0 0 var(--success);
}

[data-filter-toggle],
.filter-close{
  display: none;
}

.board-panel{
  padding: var(--space-6);
}

.request-quality,
.request-preview,
.company-contact-grid span{
  background: var(--surface);
  border: 0;
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-soft);
}

.request-form,
.request-wizard{
  gap: var(--space-4);
}

.preview-card{
  color: var(--text-soft);
}

.profile-trust-note{
  max-width: 220px;
  padding: var(--space-3);
  color: var(--text-soft);
  background: var(--surface);
  border: 0;
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-soft);
  font-size: 13px;
  font-weight: 600;
}

.mobile-fab{
  display: none;
}

@media (max-width: 760px) {
  .filters{
    position: fixed;
    top: auto;
    right: 0;
    z-index: 42;
    bottom: 0;
    left: 0;
    width: auto;
    max-height: 82vh;
    padding: var(--space-5);
    box-shadow: var(--shadow-popover);
    border-radius: var(--radius-xl) var(--radius-xl) 0 0;
    transform: translateY(110%);
  }

  body.filters-open .filters{
    transform: translateY(0);
  }

  body.filters-open::before{
    position: fixed;
    inset: 0;
    z-index: 41;
    content: "";
    background: rgba(15, 23, 42, 0.24);
  }

  [data-filter-toggle],
  .filter-close{
    display: inline-grid;
  }

}

/* Professional detail and compact list system: no card-in-card boxes */
.detail-panel{
  gap: 20px;
}

.detail-hero{
  position: relative;
  overflow: hidden;
  padding: 22px 24px;
  background: #fff;
  border: 1px solid rgba(18, 28, 24, 0.09);
  border-radius: 0;
  box-shadow: 0 22px 30px -24px rgba(18, 28, 24, 0.32);
}

.detail-hero::before{
  position: absolute;
  inset: 0 auto 0 0;
  width: 4px;
  content: "";
  background: var(--accent);
}

.detail-hero h2{
  max-width: 820px;
  margin: 10px 0 8px;
  font-size: clamp(28px, 3vw, 36px);
  line-height: 1.08;
}

.meta-grid{
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  padding: 14px 18px;
  background: #fff;
  border: 0;
  border-radius: 0;
  box-shadow: 0 18px 24px -22px rgba(18, 28, 24, 0.22);
}

.meta-box{
  min-height: auto;
  min-width: 170px;
  padding: 2px 22px 2px 0;
  margin-right: 22px;
  background: transparent;
  border: 0;
  border-right: 1px solid var(--border);
  border-radius: 0;
  box-shadow: none;
}

.meta-box:last-child{
  border-right: 0;
  margin-right: 0;
}

.meta-box span{
  color: var(--muted);
  font-size: 12px;
  font-weight: 720;
}

.meta-box strong{
  margin-top: 4px;
  color: var(--text);
  font-size: 15px;
  font-weight: 840;
  line-height: 1.25;
}

.detail-sections{
  gap: 14px;
}

.detail-description{
  padding: 18px;
  background: #fff;
  border: 0;
  border-radius: 0;
  box-shadow: 0 18px 24px -22px rgba(18, 28, 24, 0.22);
}

.detail-description h3{
  margin-bottom: 14px;
  font-size: 18px;
}

.detail-description > p{
  margin: 0;
  color: var(--text-soft);
  font-size: 15px;
  line-height: 1.55;
}

.spec-grid{
  display: grid;
  grid-template-columns: 1fr;
  gap: 0;
  margin-top: 0;
}

.spec-grid span{
  display: grid;
  grid-template-columns: minmax(150px, 0.45fr) minmax(0, 1fr);
  gap: 14px;
  min-height: auto;
  padding: 10px 0;
  color: var(--text-soft);
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--border);
  border-radius: 0;
  box-shadow: none;
  font-size: 14px;
}

.spec-grid span:last-child{
  border-bottom: 0;
}

.spec-grid strong{
  color: var(--muted);
  font-size: 13px;
  font-weight: 760;
}

.compact-item,
.request-card,
.offer-item{
  position: relative;
  overflow: hidden;
  padding: 16px 18px;
  background: #fff;
  border: 1px solid rgba(18, 28, 24, 0.28);
  border-radius: 0;
  box-shadow: 0 18px 24px -22px rgba(18, 28, 24, 0.22);
}

.compact-item::before,
.request-card::before{
  position: absolute;
  inset: 0 auto 0 0;
  width: 3px;
  content: "";
  background: #c9d5d0;
}

.compact-item:has(.status-open)::before,
.request-card:has(.status-open)::before{
  background: var(--blue);
}

.compact-item:has(.status-urgent)::before,
.request-card:has(.status-urgent)::before{
  background: var(--warning);
}

.compact-item-header,
.card-header{
  align-items: start;
}

.compact-item-header strong,
.request-card h3{
  max-width: 740px;
  color: var(--text);
  font-size: 16px;
  font-weight: 840;
  line-height: 1.25;
}

.compact-item-header > .tag,
.compact-item-header > .tag-row,
.card-header > .tag-row{
  margin-left: auto;
}

.compact-item > .muted{
  color: var(--text-muted);
  font-size: 13px;
  font-weight: 620;
}

.request-card .meta-grid{
  padding: 10px 0 0;
  border: 0;
  border-top: 1px solid var(--border);
  border-radius: 0;
  box-shadow: none;
}

.request-card .meta-box{
  min-width: 120px;
}

@media (max-width: 760px) {
.detail-hero{
    padding: 18px;
  }

  .meta-grid{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
  }

  .meta-box{
    min-width: 0;
    margin: 0;
    padding: 0;
    border-right: 0;
  }

  .spec-grid span{
    grid-template-columns: 1fr;
    gap: 3px;
  }
}

/* Plain status text for offers and urgent flame for recent requests */
.status-text,
.date-text{
  color: var(--muted);
  background: transparent;
  border: 0;
  box-shadow: none;
  font-size: 13px;
  font-weight: 740;
  line-height: 1.2;
}

.status-text.status-accepted{
  color: var(--success);
}

.status-text.status-declined{
  color: var(--danger);
}

.status-text.status-discussing{
  color: var(--blue);
}

.date-text{
  color: var(--muted);
  font-weight: 680;
}

.urgent-mark{
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: #a8640d;
  background: transparent;
  border: 0;
  font-size: 13px;
  font-weight: 820;
  line-height: 1;
}

.urgent-mark svg{
  width: 15px;
  height: 15px;
  color: #d47a12;
  fill: currentColor;
}

.compact-item-header > .urgent-mark{
  margin-left: auto;
}

/* Marketplace labels: quieter than pills,
card color already carries status */
.market-card .tag-row,
.compact-item .tag-row,
.request-card .tag-row{
  gap: 8px;
  align-items: center;
}

.market-card .tag,
.compact-item .tag,
.request-card .tag{
  color: var(--muted);
}

.market-card .tag::before,
.compact-item .tag::before,
.request-card .tag::before{
  display: none;
}

.market-card .tag:not(:last-child)::after,
.compact-item .tag:not(:last-child)::after,
.request-card .tag:not(:last-child)::after{
  margin-left: 8px;
  color: #b6c0bb;
  content: "/";
}

.market-card .status-open,
.compact-item .status-open,
.request-card .status-open,
.market-card .status-urgent,
.compact-item .status-urgent,
.request-card .status-urgent,
.market-card .status-accepted,
.compact-item .status-accepted,
.request-card .status-accepted,
.market-card .status-discussing,
.compact-item .status-discussing,
.request-card .status-discussing,
.market-card .status-declined,
.compact-item .status-declined,
.request-card .status-declined{
  display: inline-flex;
  align-items: center;
  gap: 6px;
}

.market-card .status-open,
.compact-item .status-open,
.request-card .status-open,
.market-card .status-discussing,
.compact-item .status-discussing,
.request-card .status-discussing{
  color: var(--blue);
}

.market-card .status-urgent,
.compact-item .status-urgent,
.request-card .status-urgent{
  color: #a8640d;
}

.market-card .status-accepted,
.compact-item .status-accepted,
.request-card .status-accepted{
  color: var(--success);
}

.market-card .status-declined,
.compact-item .status-declined,
.request-card .status-declined{
  color: var(--danger);
}

/* Request cards: separate urgency,
useful summary,
balanced facts */
.market-card-top{
  display: flex;
  gap: 14px;
  align-items: center;
  justify-content: flex-start;
  min-height: 18px;
}

.market-card-top .urgent-mark{
  margin-left: 4px;
}

.market-card-summary{
  max-width: 760px;
  margin: 10px 0 0;
  color: var(--text-soft);
  font-size: 14px;
  font-weight: 560;
  line-height: 1.5;
}

.market-card .tag-row .tag{
  display: inline-flex;
  min-height: 0;
  align-items: center;
  padding: 0;
  color: #69756f;
  font-size: 12px;
  font-weight: 760;
  letter-spacing: 0.01em;
}

.market-card .tag-row .tag::before,
.market-card .tag-row .tag::after{
  display: none;
  content: none;
}

.market-card .tag-row .tag:first-child{
  position: relative;
  padding-left: 10px;
}

.market-card .tag-row .tag:first-child::before{
  position: absolute;
  top: 2px;
  bottom: 2px;
  left: 0;
  display: block;
  width: 2px;
  height: auto;
  content: "";
  background: #b8c5bf;
  border-radius: 999px;
}

@media (max-width: 1100px) {
.market-card-meta{
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

@media (max-width: 760px) {
.market-card-top{
    align-items: flex-start;
  }
}

/* Compact action system: smaller buttons,
clearer hierarchy */
.table-actions .btn,
.request-table td:last-child .btn{
  min-width: 0;
  width: auto;
}

.form-actions,
.wizard-actions,
.table-actions{
  gap: 8px;
}

.offer-actions .btn,
.form-actions .btn,
.wizard-actions .btn{
  min-height: 34px;
}

@media (max-width: 760px) {
.btn,
button.btn,
a.btn{
    min-height: 40px;
    padding: 0 13px;
    font-size: 14px;
  }

  .market-card-actions{
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
  }

  .market-card-actions .btn{
    width: 100%;
  }

  .market-card-actions [data-report-request]{
    grid-column: 1 / -1;
    justify-self: center;
    width: auto;
  }

  .template-chip{
    min-height: 40px;
  }
}

/* Dashboard queues and offer cards: cleaner working information */
.work-queue{
  display: grid;
  gap: 0;
}

.queue-row{
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 16px;
  align-items: center;
  padding: 15px 0;
  color: var(--text);
  text-decoration: none;
  border-bottom: 1px solid var(--border);
}

.queue-row:last-child{
  border-bottom: 0;
}

.queue-row span{
  font-size: 15px;
  font-weight: 820;
  line-height: 1.25;
}

.queue-row small{
  color: var(--muted);
  font-size: 13px;
  font-weight: 620;
}

.queue-row strong{
  grid-column: 2;
  grid-row: 1 / 3;
  color: var(--text);
  font-size: 24px;
  font-weight: 860;
  line-height: 1;
}

.queue-row:hover span{
  color: var(--accent);
}

.queue-row.urgent strong{
  color: var(--accent);
}

.queue-row.warning strong{
  color: #b66a00;
}

.offer-terms-line{
  display: flex;
  flex-wrap: wrap;
  gap: 8px 18px;
  padding: 0;
  background: transparent;
  border: 0;
  border-radius: 0;
}

.offer-terms-line span{
  display: inline-flex;
  gap: 5px;
  align-items: baseline;
  margin: 0;
  color: var(--text-soft);
  font-size: 14px;
  font-weight: 620;
  line-height: 1.35;
}

.offer-terms-line strong{
  display: inline;
  color: var(--muted);
  font-size: 14px;
  font-weight: 760;
  line-height: inherit;
}

.offer-company-line{
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
  align-items: baseline;
  color: var(--muted);
}

.offer-company-line strong{
  color: var(--text);
  font-size: 15px;
  font-weight: 830;
}

.offer-company-line span{
  position: relative;
  padding: 0 0 0 12px;
  color: var(--muted);
  background: transparent;
  border: 0;
  border-radius: 0;
  font-size: 13px;
  font-weight: 650;
}

.offer-company-line span::before{
  position: absolute;
  top: 50%;
  left: 0;
  width: 1px;
  height: 12px;
  content: "";
  background: var(--border-strong);
  transform: translateY(-50%);
}

@media (max-width: 760px) {
.queue-row{
    padding: 14px 0;
  }

  .queue-row strong{
    font-size: 21px;
  }

  .offer-terms-line{
    gap: 7px 12px;
  }
}
