/* Results table — React ResultPage, not the email КП. */
.result-wrapper {
  padding: 1.2rem;
  max-width: 768px;
  margin: 0 auto;
  background: #fff;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}
.result-wrapper h2 {
  font-size: 1.2rem;
  font-weight: 700;
  color: #00B5D3;
  margin-bottom: 1.2rem;
  text-align: center;
}
.order-button-container {
  display: flex;
  justify-content: flex-end;
  margin-top: 1.5rem;
}
.result-order-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.order-button {
  background: linear-gradient(135deg, #00B5D3 0%, #0089a7 100%);
  color: white;
  padding: 0.8rem 2rem;
  border: none;
  border-radius: 6px;
  font-size: 1.1rem;
  font-weight: 600;
  cursor: pointer;
}
.order-button:hover {
  background: linear-gradient(135deg, #0089a7 0%, #006d85 100%);
}

.result-material-table {
  width: 100%;
  border: 1px solid #00B5D3;
  border-collapse: collapse;
  margin-bottom: 1.6rem;
  table-layout: fixed;
}
.result-material-table td {
  border: 1px solid #00B5D3;
  padding: 0;
  vertical-align: top;
}
.result-material-table .material-cell-text {
  width: 58%;
  padding: 0.6rem 0.8rem;
  font-size: 0.85rem;
}
.result-material-table .material-cell-image {
  min-height: 96px;
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
  background-color: #f3f4f6;
}

.result-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.85rem;
  margin-bottom: 1.6rem;
}
.result-table th,
.result-table td {
  border: 1px solid #00B5D3;
  padding: 0.6rem 0.8rem;
  word-break: break-word;
}
.result-table th {
  background: #00B5D3;
  color: white;
  font-weight: 600;
}
.result-table tr:hover { background: #f0f9fb; }
.result-items td:nth-child(2) { text-align: center; white-space: nowrap; }
.result-items td:nth-child(3) { text-align: right; white-space: nowrap; }
.result-cost-free { color: #00B5D3; font-weight: 700; }

.result-total {
  font-size: 1.4rem;
  font-weight: 700;
  text-align: right;
  color: #00B5D3;
  margin-bottom: 1rem;
  padding: 0.8rem;
  background: #f0f9fb;
  border-radius: 6px;
  border: 2px solid #00B5D3;
}
.result-empty { color: #666; }

@media (max-width: 600px) {
  .result-wrapper { padding: 0.8rem; }
  .result-table,
  .result-material-table .material-cell-text { font-size: 0.72rem; }
  .result-table th,
  .result-table td,
  .result-material-table td { padding: 0.4rem; }
  .result-total { font-size: 0.9rem; }
  .order-button {
    font-size: 0.85rem;
    padding: 0.55rem 1rem;
    width: 100%;
  }
  .order-button-container { justify-content: stretch; }
}