/* Desktop and General Styles */
.custom-orders-history {
    width: 100%;
    margin: 1px;
    background-color: white;
}

.orders-history-title {
    font-family: 'Poppins', sans-serif;
    font-size: 34px;
    font-weight: 700;
    color: black;
    text-align: left;
    margin-bottom: 30px;
}

.orders-history-table {
    width: 100%;
    border-collapse: collapse;
    border: 0px solid #ddd;
    background-color: white;
}

.orders-history-table thead {
    background-color: #EFEFEF;
    padding:5px 5px 5px 5px;
}

.orders-history-table th,
.orders-history-table td {
    padding: 12px;
    border: 1px solid #ddd;
    text-align: left;
    vertical-align: middle;
}

.orders-history-table th {
    font-family: 'Poppins', sans-serif;
    font-size: 18px;
    font-weight: 700;
    color: black;
    margin: 10px 0;
}

.orders-history-table td {
    font-family: 'Poppins', sans-serif;
    font-size: 16px;
    font-weight: 500;
    color: #78716C;
}

.orders-history-table td .product-thumbnail {
    display: inline-block;
    width: 50px;
    height: 50px;
    vertical-align: middle;
}

.orders-history-table td .product-thumbnail img {
    width: 50px;
    height: 50px;
    object-fit: cover;
    display: block;
}

.orders-history-table td .product-name {
    display: inline-block;
    vertical-align: middle;
    margin-left: 10px;
}

.orders-history-table td .order-status.completed {
    border: 1px solid #94C748;
    background-color: white;
    color: #94C748;
    padding: 12px 18px;
    border-radius: 8px;
}

.orders-history-table td .order-status.completed:hover {
    background-color: #94C748;
    color: white;
}

.orders-history-table td .order-status.processing {
    border: 1px solid #FDAC74;
    background-color: white;
    color: #FDAC74;
    padding: 12px 18px;
    border-radius: 8px;
}

.orders-history-table td .order-status.processing:hover {
    background-color: #FDAC74;
    color: white;
}

.orders-history-table td .order-status.cancelled {
    border: 1px solid #F87171;
    background-color: white;
    color: #F87171;
    padding: 12px 18px;
    border-radius: 8px;
}

.orders-history-table td .order-status.cancelled:hover {
    background-color: #F87171;
    color: white;
}

.orders-history-table td .order-status.monthly-payment {
    border: 1px solid #FFB61D;
    background-color: white;
    color: #FFB61D;
    padding: 12px 18px;
    border-radius: 8px;
}

.orders-history-table td .order-status.monthly-payment:hover {
    background-color: #FFB61D;
    color: white;
}

.order-again-button {
    border: 1px solid #ffb61d;
    background-color: #ffb61d;
    color: black;
    font-weight: 500;
    padding: 12px 18px;
    border-radius: 8px;
    cursor: pointer;
    transition: background 0.3s, color 0.3s;
}

.order-again-button:hover {
    background: white;
    color: black;
    border-color: #ffb61d;
}

/* Ensure address is inline and doesn't overlap */
.orders-history-table td .address {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}