/* from bootstrap 5 */
.text-decoration-line-through {
    text-decoration: line-through !important;
}

/* end from bootstrap 5 */
.text-color-iziloh {
    color: #6418C3;
}
.text-color-purple {
    color: #763f98;
}
.text-color-dark-green {
    color: #347048;
}
.text-color-green-light {
    color: #0CCDA3;
}
.text-color-red {
    color: #C03A2B;
}
.text-total {
    font-size: 18px;
    font-weight: 500;
}
.alert.alert-plain {
    border-color: #91a3b0;
    background-color: transparent;
    color: #91a3b0;
}
.alert.alert-danger.alert-plain {
    border-color: #c03a2b;
    background-color: transparent;
    color: #c03a2b;
}
.iz-detail-larger {
    font-size: 1.1em;
}
.iz-detail .label {
    margin-bottom: 0.25rem;
}
.iz-card-info {
    display: flex;
    background-color: rgba(244, 245, 252, 1);
    padding: 16px;
    flex-direction: column;
    justify-content: flex-end;
    align-items: flex-start;
    border-radius: 4px;
    color: #3f3d47;
}
.iz-card-info.card-image {
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
}
.iz-card-info .label {
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 22px;
}
.iz-card-info .detail-value {
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 26px;
}
.iz-card-info.card-image .label {
    flex: 50%;
    padding-right: 5px;
    text-align: center;
}
.iz-card-info.card-image .detail-value {
    flex: 50%;
}
.iz-card-info.card-image img {
    width: 100%;
    height: auto;
}
.iz-title-image-container img {
    width: 50px;
    height: 50px;
    object-fit: cover;
}
.iz-field-detail {
    display: flex;
    justify-content: flex-start;
    margin-bottom: 1rem;
}
.iz-field-label {
    flex: 0 1 135px;
}
.iz-field-label.iz-field-label-width-150 {
    flex: 0 1 150px;
}
.iz-field-value {
    font-weight: 500;
    word-break: break-word !important;
    overflow-wrap: break-word !important;
    white-space: normal;
    flex-basis: calc(100% - 140px);
    padding-left: 5px;
    position: relative;
}
.iz-field-detail .iz-field-value::before {
    position: absolute;
    content: ":";
    left: -2px;
}
.iz-field-label.iz-field-label-width-150 ~ .iz-field-value {
    flex-basis: calc(100% - 155px);
}
table.table.iz-detail-table {
    border-radius: 5px;
    border-spacing: 0;
    border-collapse: separate !important;
}
.iz-detail-table thead th {
    border: 1px solid #1d3022;
    border-left-width: 0;
    border-right-width: 0;
    background-color: #fff;

    /* dont remove this line, this for override bootstrap layout */
    border-bottom-width: 1px;
}
.iz-detail-table thead tr th:first-child {
    border-left-width: 1px;
}
.iz-detail-table thead tr th:last-child {
    border-right-width: 1px;
}
.iz-detail-table thead tr:first-child th:first-child {
    border-top-left-radius: 5px;
}
.iz-detail-table thead tr:first-child th:last-child {
    border-top-right-radius: 5px;
}
table.table.iz-detail-table thead > tr {
    border-radius: 5px;
}
table.table.iz-detail-table th {
    padding: 16px;
}
table.table.iz-detail-table tr td {
    vertical-align: middle;
    padding: 30px;
    border-bottom: 1px solid #F4F5FC;
}
table.table.iz-detail-table.iz-detail-table-noheader tr:first-child td {
    border-top: 1px solid #F4F5FC;
}
table.table.iz-detail-table.iz-detail-table-noheader tr:first-child td:first-child {
    border-top-left-radius: 5px;
}
table.table.iz-detail-table.iz-detail-table-noheader tr:first-child td:last-child {
    border-top-right-radius: 5px;
}
table.table.iz-detail-table.iz-detail-table-subtotal tr td {
    padding: 12px 26px;
}
table.table.iz-detail-table tr td:first-child {
    border-left: 1px solid #F4F5FC;
}
table.table.iz-detail-table tr td:last-child {
    border-right: 1px solid #F4F5FC;
}
table.table.iz-detail-table tr:last-child td:first-child {
    border-bottom-left-radius: 5px;
}
table.table.iz-detail-table tr:last-child td:last-child {
    border-bottom-right-radius: 5px;
}
.iz-detail-table.iz-detail-table-pending thead th,
.iz-detail-table.iz-detail-table-success thead th {
    border-color: #763f98;
    background-color: #763f98;
    color: #fff;
}
.iz-detail-table.iz-detail-table-on-pickup thead th,
.iz-detail-table.iz-detail-table-on-pickup-courier thead th,
.iz-detail-table.iz-detail-table-picked thead th {
    border-color: #5ab5e1;
    background-color: #5ab5e1;
    color: #fff;
}
.iz-detail-table.iz-detail-table-on-process thead th {
    border-color: #d769fd;
    background-color: #d769fd;
    color: #fff;
}
.iz-detail-table.iz-detail-table-on-shipping thead th,
.iz-detail-table.iz-detail-table-on-shipping-courier thead th {
    background-color: #ffdc73;
    color: #1d3022;
}
.iz-detail-table.iz-detail-table-completed thead th {
    border-color: #28a745;
    background-color: #28a745;
    color: #fff;
}
.iz-detail-table.iz-detail-table-expired thead th {
    border-color: #91a3b0;
    background-color: #91a3b0;
    color: #fff;
}
.iz-detail-table.iz-detail-table-canceled thead th {
    border-color: #c03a2b;
    background-color: #c03a2b;
    color: #fff;
}
.iz-detail-table.iz-detail-table-waiting thead th {
    border-color: #925218;
    background-color: #925218;
    color: #fff;
}
.iz-detail-table.iz-detail-table-light-brown thead th {
    border-color: #dd7f29;
    background-color: #dd7f29;
    color: #fff;
}
.iz-dropdown-order.whitespace-normal a.btn.dropdown-toggle {
    white-space: normal !important;
}
.iz-dropdown-order a.btn.dropdown-toggle {
    width: 150px;
    text-align: left;
    position: relative;
}
.iz-dropdown-order a.btn.dropdown-toggle::after {
    position: absolute;
    right: 16px;
    top: calc(50% + 3px);
    transform: translateY(-50%) rotate(45deg);
}
.iz-dropdown-order.iz-dropdown-order-pending a.btn.dropdown-toggle,
.iz-dropdown-order.iz-dropdown-order-on-pickup a.btn.dropdown-toggle,
.iz-dropdown-order.iz-dropdown-order-on-pickup-courier a.btn.dropdown-toggle,
.iz-dropdown-order.iz-dropdown-order-picked a.btn.dropdown-toggle {
    border-color: #763f98 !important;
    background-color: #763f98 !important;
    color: #fff !important;
}
.iz-dropdown-order.iz-dropdown-order-success a.btn.dropdown-toggle {
    border-color: #5ab5e1 !important;
    background-color: #5ab5e1 !important;
    color: #fff !important;
}
.iz-dropdown-order.iz-dropdown-order-on-process a.btn.dropdown-toggle {
    border-color: #d769fd !important;
    background-color: #d769fd !important;
    color: #fff !important;
}
.iz-dropdown-order.iz-dropdown-order-on-shipping a.btn.dropdown-toggle,
.iz-dropdown-order.iz-dropdown-order-on-shipping-courier a.btn.dropdown-toggle {
    border-color: #ffdc73 !important;
    background-color: #ffdc73 !important;
    color: #1d3022 !important;
}
.iz-dropdown-order.iz-dropdown-order-completed a.btn.dropdown-toggle {
    border-color: #28a745 !important;
    background-color: #28a745 !important;
    color: #fff !important;
}
.iz-dropdown-order.iz-dropdown-order-expired a.btn.dropdown-toggle {
    border-color: #91a3b0 !important;
    background-color: #91a3b0 !important;
    color: #fff !important;
}
.iz-dropdown-order.iz-dropdown-order-canceled a.btn.dropdown-toggle {
    border-color: #c03a2b !important;
    background-color: #c03a2b !important;
    color: #fff !important;
}
.iz-dropdown-order.iz-dropdown-order-waiting a.btn.dropdown-toggle {
    border-color: #925218 !important;
    background-color: #925218 !important;
    color: #fff !important;
}
.iz-only-print {
    display: none !important;
}

.iz-button-order {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 3rem;
}

.iz-button-order.iz-button-order-on-pickup,
.iz-button-order.iz-button-order-picked {
    background: #5AB5E1;
    color: #ffffff;
}

.iz-button-order.iz-button-order-on-pickup:hover,
.iz-button-order.iz-button-order-on-pickup:focus,
.iz-button-order.iz-button-order-on-pickup:active,
.iz-button-order.iz-button-order-picked:hover,
.iz-button-order.iz-button-order-picked:focus,
.iz-button-order.iz-button-order-picked:active {
    -webkit-box-shadow: 0 0 0 1px #5AB5E1 inset;
    box-shadow: 0 0 0 1px #5AB5E1 inset;
    color: #5AB5E1;
    background: #ffffff;
}

.iz-button-order.iz-button-order-waiting {
    background: #DD7F29;
    color: #ffffff;
}

.iz-button-order.iz-button-order-waiting:hover,
.iz-button-order.iz-button-order-waiting:focus,
.iz-button-order.iz-button-order-waiting:active {
    -webkit-box-shadow: 0 0 0 1px #DD7F29 inset;
    box-shadow: 0 0 0 1px #DD7F29 inset;
    color: #DD7F29;
    background: #ffffff;
}

.iz-button-order.iz-button-order-on-process {
    background: #D769FD;
    color: #ffffff;
}

.iz-button-order.iz-button-order-on-process:hover,
.iz-button-order.iz-button-order-on-process:focus,
.iz-button-order.iz-button-order-on-process:active {
    -webkit-box-shadow: 0 0 0 1px #D769FD inset;
    box-shadow: 0 0 0 1px #D769FD inset;
    color: #D769FD;
    background: #ffffff;
}

.iz-button-order.iz-button-order-on-shipping,
.iz-button-order.iz-button-order-delivered {
    background: #FFDC73;
    color: #ffffff;
}

.iz-button-order.iz-button-order-on-shipping:hover,
.iz-button-order.iz-button-order-on-shipping:focus,
.iz-button-order.iz-button-order-on-shipping:active,
.iz-button-order.iz-button-order-delivered:hover,
.iz-button-order.iz-button-order-delivered:focus,
.iz-button-order.iz-button-order-delivered:active {
    -webkit-box-shadow: 0 0 0 1px #FFDC73 inset;
    box-shadow: 0 0 0 1px #FFDC73 inset;
    color: #FFDC73;
    background: #ffffff;
}

.iz-button-order.iz-button-order-completed {
    background: #28A745;
    color: #ffffff;
}

.iz-button-order.iz-button-order-completed:hover,
.iz-button-order.iz-button-order-completed:focus,
.iz-button-order.iz-button-order-completed:active {
    -webkit-box-shadow: 0 0 0 1px #28A745 inset;
    box-shadow: 0 0 0 1px #28A745 inset;
    color: #28A745;
    background: #ffffff;
}

.iz-button-order.iz-button-order-canceled {
    -webkit-box-shadow: 0 0 0 1px #C03A2B inset;
    box-shadow: 0 0 0 1px #C03A2B inset;
    color: #C03A2B;
}

.iz-button-order.iz-button-order-canceled:hover,
.iz-button-order.iz-button-order-canceled:focus,
.iz-button-order.iz-button-order-canceled:active {
    background: #C03A2B;
    color: #ffffff;
}

.iz-detail-tab-empty {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 200px;
    font-family: 'DM Sans';
    font-style: normal;
    font-weight: 500;
    font-size: 24px;
    color: #DFDEDE;
}

/*
const TRANSACTION_STATUS_DRAFT = 'DRAFT';
const TRANSACTION_STATUS_PENDING = 'PENDING';
const TRANSACTION_STATUS_SUCCESS = 'SUCCESS';
const TRANSACTION_STATUS_ON_PICKUP = 'ON_PICKUP';
const TRANSACTION_STATUS_ON_PICKUP_COURIER = 'ON_PICKUP_COURIER';
const TRANSACTION_STATUS_PICKED = 'PICKED';
const TRANSACTION_STATUS_WAITING = 'WAITING';
const TRANSACTION_STATUS_ON_PROCESS = 'ON_PROCESS';
const TRANSACTION_STATUS_ON_SHIPPING = 'ON_SHIPPING';
const TRANSACTION_STATUS_ON_SHIPPING_COURIER = 'ON_SHIPPING_COURIER';
const TRANSACTION_STATUS_DELIVERED = 'DELIVERED';
const TRANSACTION_STATUS_COMPLETED = 'COMPLETED';
const TRANSACTION_STATUS_CANCELED = 'CANCELED';
const TRANSACTION_STATUS_EXPIRED = 'EXPIRED';
const TRANSACTION_STATUS_FAILED = 'FAILED';
*/

@media print {

    body {
        -webkit-print-color-adjust: exact;
    }
    .layout-footer, .layout-navbar {
        display: none !important;
    }
    .iz-not-printable {
        display: none !important;
    }
    .iz-only-print {
        display: block !important;
    }
    table.table.iz-detail-table {
        border-collapse: collapse !important;
        border: 0 solid #c4c4c4 !important;
        border-spacing: 0 !important;
        width: 100% !important;
        border-color: #c4c4c4 !important;
    }
    table.table.iz-detail-table tr {
        border-color: #c4c4c4 !important;
        border-style: none !important;
        border-width: 0 !important;
    }
    table.table.iz-detail-table th {
        border-color: #c4c4c4 !important;
        border-top: 2pt solid !important;
        border-bottom: 2pt solid !important;
        background: #c4c4c4 !important;
        color: #fff !important;
    }
    table.table.iz-detail-table td {
        border-width: 0 !important;
        border-color: #c4c4c4 !important;
        border-bottom-width: 1pt !important;
    }
    table.table.iz-detail-table tr:first-child td {
        border-top-width: 1pt !important;
    }
    table.table.iz-detail-table td:first-child {
        border-color: #c4c4c4 !important;
        border-left-width: 1pt !important;
    }
    table.table.iz-detail-table td:last-child {
        border-color: #c4c4c4 !important;
        border-right-width: 1pt !important;
    }
}