.mobile-format {
    font-size: 1em;
}

.order-card.pending {
    background-color: #f3fcff;
}

.order-card.pending:nth-child(even) {
    background-color: #ffffff;
}

.order-card.editing {
    background-color: #fdff8d;
}

.order-card.deleted {
    background-color: #ff623b;
    color: #ffffff;
}

.order-card.processed {
    background-color: #d2ffd8;
}

.order-card.status-1 {
    /*background-color: #00f3ff;*/
    background-image: linear-gradient(
        45deg,
        #d4f5ce 25%,
        #ffffff 25%,
        #ffffff 50%,
        #d4f5ce 50%,
        #d4f5ce 75%,
        #ffffff 75%,
        #ffffff 100%
    );
}

.order-card.status-2 {
    background-image: linear-gradient(
        45deg,
        #fcfcb5 25%,
        #ffffff 25%,
        #ffffff 50%,
        #fcfcb5 50%,
        #fcfcb5 75%,
        #ffffff 75%,
        #ffffff 100%
    );
}
.order-card.error {
    background-image: linear-gradient(
        45deg,
        #ffd9d9 25%,
        #ffffff 25%,
        #ffffff 50%,
        #ffd9d9 50%,
        #ffd9d9 75%,
        #ffffff 75%,
        #ffffff 100%
    );
}

.order-card .order-header {
    margin: 0 -15px;
    padding: 0 15px;
}

.order-card .order-details {
    display: none;
}

.order-card .order-details .details-table {
    display: block;
}

.order-card .order-details .details-table .header {
    display: flex;
    font-weight: bold;
}

.order-card .order-details .details-table .detail-row {
    display: flex;
}

.order-card .order-details .details-table .detail-row:nth-child(even) {
    background-color: #b1d8ee;
}

.order-card .order-details .details-table .detail-row .mobile-label {
    display: none;
}

.order-card .order-details .details-table .number {
    flex: 0 0 30px;
}

.order-card .order-details .details-table .codigo {
    flex: 0 0 65px;
}

.order-card .order-details .details-table .item {
    flex: 1 0 60px;
}

.order-card .order-details .details-table .cantidad {
    flex: 0 0 80px;
    text-align: right;
}

.order-card .order-details .details-table .inventario {
    flex: 0 0 90px;
    text-align: right;
}

.order-card .order-details .details-table .precio {
    flex: 0 0 50px;
    text-align: right;
}

.order-card .order-details .details-table .descuento {
    flex: 0 0 65px;
}

.order-card .order-details .details-table .total {
    flex: 0 0 95px;
    text-align: right;
}

.order-card .order-details-toggle-btn {
    background-color: #2f5e66;
    cursor: pointer;
    color: white;
}

.order-card .option-btn {
    margin-bottom: 3px;
    width: 44px;
    height: 38px;
}

.order-form .order-detail-line {
    padding: 3px 0;
}

.order-form .order-detail-line:nth-child(even) {
    background-color: #f1f8ff;
}

.collection-report .cut-row {
    padding: 2px;
}

.collection-report .cut-row:nth-child(odd) {
    background-color: #f3f3f3;
}

.downloadables-index .downloadable-card:nth-child(even) {
    background-color: #e4faff;
}

.downloadables-index .downloadable-card .card-header {
    cursor: pointer;
}

.downloadables-index .downloadable-row {
    padding: 2px 0;
}

.downloadables-index .downloadable-row:nth-child(odd) {
    background-color: #f9ffdf;
}

mark {
    padding: 0;
    background-color: #fbff00;
}

@media (max-width: 576px) {
    .order-card .order-header .client-name {
        font-weight: bold;
    }

    .mobile-format {
        font-size: 0.85em;
    }
}

@media (max-width: 720px) {
    .order-card .order-details .details-table .header {
        display: none;
    }

    .order-card .order-details .details-table .detail-row {
        display: block;
        margin-bottom: 5px;
        background-color: #e8e8e8;
    }

    .order-card .order-details .details-table .detail-row:nth-child(even) {
        background-color: #b1d8ee;
    }

    .order-card .order-details .details-table .detail-row .mobile-row {
        display: flex;
    }

    .order-card .order-details .details-table .detail-row .mobile-label {
        display: block;
        font-weight: bold;
        width: 100px;
        text-align: left;
    }

    .order-card .order-details .details-table .detail-row .mobile-data {
        display: block;
        text-align: right;
        flex-grow: 1;
    }
}
