@import "~cosmoUiVariables";

$courier-card-padding: 12px; //6px 6px 0px 6px;
$courier-card-font-size: 10px;

// card widths
$courier-card-avatar-width: 15%;
$courier-card-details-width: 74%;
$courier-card-main-row-height: 43px;


.container {
    padding: $courier-card-padding;
    font-size: $courier-card-font-size;
}

.afterActive {
    border-top: 1px solid transparent;
}

.jobAllocated {
    background: $bg-global;
    border: 1px solid $available;
}


.mainRow {
    min-height: $courier-card-main-row-height;
    // pointer-events: none;
}

.avatar {
    flex-basis: $courier-card-avatar-width;
}

.avatarIcon {
    padding: 3px;
    border-radius: 100%;
    border: $border-transparent;
}

.details {
    flex-basis: $courier-card-details-width;
}

.idle {
    fill: $available;
}

.busy {
    fill: $color-yellow-500;
}

.last-stop {
    fill: $unavailable;
}

.offline {
    fill: $offline;
}

.avatar {
    flex-basis: 15%;
}

.details {
    flex-basis: 74%;
}

.vehicle {
    flex-basis: 11%;
}