.orderhistory-info-block {
    display: flex;
    justify-content: space-between;
    background: #f0f7ff;
    padding-left: 20px;
    border-radius: 8px;
    margin-bottom: 20px;
    gap: 20px;
    flex-wrap: wrap; /* mòbil */
}

.orderhistory-info-block .info-text {
    display: flex;
    flex-direction: column; /* elementos apilados verticalmente */
    margin-bottom: 20px;
}
.orderhistory-info-block .info-text h3 {
    font-size: 20px;
    margin-bottom: 20px; /* abans 10px */
    margin-top: 20px;
    font-weight: bold;
    color: #222;
    line-height: 1.4; /* millora la llegibilitat */
}

.orderhistory-info-block .info-text p {
    font-size: 14px;
    margin-bottom: 20px; /* abans 15px */
    color: #333;
    line-height: 1.5; /* més aire entre línies */
}

.orderhistory-info-block .btn-view-orders {
    display: flex;
    padding: 10px 20px;
    background: #1f3c88;
    color: #fff;
    text-decoration: none;
    border-radius: 20px;
    font-weight: bold;
    transition: background 0.3s;
    align-self: flex-end; /* esto empuja el botón a la derecha */
   
    max-width: fit-content;
}

.orderhistory-info-block .btn-view-orders:hover {
    background: #15285a;
}

.orderhistory-info-block .info-image img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* cobreix tot l'espai sense deformar */
    max-width: 360px;
    border-radius: 6px;
}

.orders-message{
    font-size: 18px;
    margin-bottom: 20px; /* abans 10px */
    margin-top: 20px;
    font-weight: bold;
    color: #222;
    line-height: 1.4; /* millora la llegibilitat */
}

.order-info-block{
    max-width: 695px;
}

@media (max-width: 768px) {
  .order-info-block {
    text-wrap: balance;
  }

  .orderhistory-info-block {
    flex-direction: column-reverse; /* apilar verticalment en mòbil */
    padding-left: 0;
  }

  .orderhistory-info-block .info-text {
    padding: 0 20px;
  }
}